What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Need custom calculation on my form

    Asked by thcm on July 17, 2013 at 10:58 AM

    I have a purchase order set up in my form.  Users can select only one of three options.  I would like to pre-populate another field using a formula based on their inputted data.

     

    1.  $5 * number of students

    2.  $4 * number of students

    3.  $6 * number of students

     

    Down below in the table is information about chaperones.  Our policy is 1 adult to every 5 children so I'd like the "Required Number of Chaperones" field to prepopulate, mulitplying 0.2 times the number of students the user inputted.

     

    Is that possible?  Without a Java workaround that will cause problems with my Joomla?

    http://jotform.us/form/31505524369151

    Thank you.

     

     

    JotForm purchase table workaround
  • Profile Image
    JotForm Support

    Answered by EltonCris on July 17, 2013 at 12:37 PM

     

    Hi,

    We do not have calculations feature available in the form builder except on Payment Tools and Grading Tools so this is not possible unfortunately. The only way to achieve that is to use your form source code and apply custom javascript codes to achieve the function you want.

    Also, I don't think it's an issue when you embed your modified form as iframe in your Joomla. That shouldn't be a problem.

    Example:

    <iframe allowtransparency="true" src="http://www.yourwebsite.com/customform.html" frameborder="0" style="width:100%; height:727px; border:none;" scrolling="no"></iframe>tyle="width:100%; height:727px; border:none;" scrolling="no">

    Replacing the custom form URL to your customized form saved as html.

    If you want this solution, maybe we can come up with the script for you. Thanks!

  • Profile Image

    Answered by thcm on July 17, 2013 at 01:12 PM

    I'm not sure what exactly all of that means, but if it'll work...let's do it!

  • Profile Image
    JotForm Support

    Answered by EltonCris on July 17, 2013 at 01:17 PM

    @thcm

    Sounds a bit complicated, I will provide a step by step instruction later today. Let me come up with the custom script needed for the caluclation first. It may take some time.

    Thanks!

  • Profile Image

    Answered by thcm on July 17, 2013 at 01:21 PM

    Cool!  Does my description of what I'm trying to accomplish make sense?

  • Profile Image
    JotForm Support

    Answered by KadeJM on July 17, 2013 at 01:39 PM

    thcm , I spoke to Elton and he said he understands you. Your provided details gave him an idea in regards to this that is being worked on and will update you later on it when finished. If at some point there's any confusion about this then it will be discussed between now and then.

  • Profile Image

    Answered by thcm on July 17, 2013 at 03:08 PM

    Additionally, is it possible to make the number rounded up to the nearest whole number?

  • Profile Image
    JotForm Support

    Answered by Mike_T on July 17, 2013 at 03:28 PM

    Yes, the number rounding is possible with Javascript, but it might take some time to write the whole script per your requirements.

  • Profile Image
    JotForm Support

    Answered by EltonCris on July 18, 2013 at 01:52 AM

    @thcm

    Ok, here's how to implement the script in your form.

    1. Get your form source code, copy it and paste it to notepad or any other html editing tools you may have. How to get your Form Source Code

    2. Copy this calculation script and paste it at the bottom part of the entire form source code.

    3. Save the modified form source code as html file e.g. customform.html and upload it to your server or to any hosting you may have.

    4. Get the URL of the uploaded custom form and embed it as iframe in your Joomla.

    Example:

    <iframe allowtransparency="true" src="http://www.yourwebsite.com/customform.html" frameborder="0" style="width:100%; height:3537px; border:none;" scrolling="auto"></iframe>

    Replace the underlined form URL into your custom form URL. You also need to adjust the height so it fits exactly in your form but I think 3537px is enough. :)

    To embed this code to your Joomla, follow this guide: How to Add Forms to Joomla 2.5

    Hope this help. By the way, the calculation script has the round to nearest whole number function. Example if chaperones is greater than 0.5, it rounds to 1. See this live demo: https://shots.jotform.com/elton/user_calculation_245102.html

    Thanks!

  • Profile Image

    Answered by thcm on July 18, 2013 at 03:55 PM
    This worked beautifully...except my form's text isn't wrapping. Instead,
    it's running off beyond the form's width. Any suggestions?
    http://terrehautechildrensmuseum.com/index.php?option=com_content&view=article&id=278&Itemid=159
  • Profile Image
    JotForm Support

    Answered by Mike_T on July 18, 2013 at 05:38 PM

    It seems that this is happening in IE only, due to some width problem.

    You can try to play with the iFrame width.

    For example, try to change the width to 550px or some other value:

    <iframe allowtransparency="true" src="//thchildrensmuseum.coffeecup.com/storage/fieldtripform2.html" frameborder="0" style="border: currentColor; width: 550px; height: 3537px;" scrolling="auto" width="100%" height="3537"></iframe>

  • Profile Image
    JotForm Support

    Answered by Mike_T on July 18, 2013 at 05:46 PM

    Also, you have specified the iFrame width in two places so the code can be:

    <iframe allowtransparency="true" src="//thchildrensmuseum.coffeecup.com/storage/fieldtripform2.html" frameborder="0" style="border: currentColor; width: 550px; height: 3537px;" scrolling="auto" width="550" height="3537"></iframe>

  • Profile Image

    Answered by thcm on July 23, 2013 at 12:36 PM
    I tried both variations but IE still doesn't wrap the text. Any ideas?
  • Profile Image

    Answered by dinesh-it on July 23, 2013 at 01:15 PM

    Hi, can you please verify the Page URL. When I tried to open this page I got 404 Page not found Error:

     http://terrehautechildrensmuseum.com/index.php?option=com_content&view=article&id=278&Itemid=159

     

    Thank you.

  • Profile Image

    Answered by thcm on July 23, 2013 at 01:21 PM
    That URL is up now. Sorry.
  • Profile Image
    JotForm Support

    Answered by Welvin on July 23, 2013 at 02:27 PM

    Hi,

    It works for me. I'm running IE9 in Compatibility View Mode. Screenshots below:

    https://shots.jotform.com/welvin/screen/eteusutzme.png

    https://shots.jotform.com/welvin/screen/xst600r3tp.png

    What's your current IE version/OS? 

    Also try injecting the below codes to the current Form Source to this page: http://thchildrensmuseum.coffeecup.com/storage/fieldtripform3.html;

    .form-label-top {

    width: 500px;

    }

    #id_79 {

    width: 550px;

    }

    Inject below the line per screenshot below:

    This should help as well. Please let us know for the results.

    Thanks

  • Profile Image
    JotForm Support

    Answered by Welvin on July 23, 2013 at 02:28 PM

    If it still not working, please create a separate thread so we can continue assist you there. Thanks