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

    Embedded Form on the Website is cut-off when using Iframe Embed Code

    Asked by spokanebodybuilding on September 11, 2015 at 03:26 PM
    We recently had our website rebuilt and after doing so we're having the same intermitent issue with payments not calculating properly again:  http://spokanebodybuilding.com/night-of-champions/night-of-champions-entry-form/

    If we use the iframe code the submit button gets cut off on about half the devices that try to access this page

    script conflict cutoff iframe mobile
  • Profile Image
    JotForm Support

    Answered by jonathan on September 11, 2015 at 03:39 PM

    Please update the form with the following changes

    #1. Add the Mobile Responsive widget to the form http://www.jotformpro.com/form/51468406349966

    link: http://widgets.jotform.com/widget/mobile_responsive

    #2. Save the Form

    #3. Re-embed the Form to the website using this iframe code.

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformpro.com/form/51468406349966" frameborder="0" style="width:100%; height:2905px; border:none;" scrolling="no"></iframe>

     

    Save your website page. And then check and test again the form.

    Let us know if this process did ot resolve the issue.

  • Profile Image

    Answered by spokanebodybuilding on September 11, 2015 at 11:39 PM

    I'm having an odd issue - When I copy and paste the iframe code you provided and save it, Wordpress is automatically modifying the code to this:

    <iframe id="JotFormIFrame" style="width: 100%; height: 2905px; border: none;" src="//form.jotformpro.com/form/51468406349966" width="300" height="150" frameborder="0" scrolling="no"></iframe> 

     

    I'm not sure why the change but we again run into the problem of the submit button getting cut off on mobile devices.  For a temporary fix we've set the height to 4200px which is functional but leaves a huge blank space at the bottom of the form.

  • Profile Image
    JotForm Support

    Answered by jonathan on September 12, 2015 at 06:23 PM

    I apologize for the confusion. I seems that the iframe code I had provided previously was encoded when I added it on my message. As you can see the src URL had become only //form.jotformpro  which lack the http protocol.

    Since you now mention this is on the Wordpress page, can you please get instead the iframe embed code using your Form Builder.

    user guide: https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code

     

    Re-embed the code to your website. Make sure to remove first any existing old embedded code before adding the new code.

    If you are having issue with the Wordpress embed you can also review this article.

    https://www.jotform.com/help/324-A-Guide-To-Forms-For-WordPress-JotForm-Users

    Plesae let us know if still not resolve.

     

  • Profile Image

    Answered by spokanebodybuilding on September 12, 2015 at 06:42 PM

    I have tried as you suggested and am getting no change.  The form is still leaving us with a large blank area under the form on a PC and cutting off the submit button on phones.

     

  • Profile Image
    JotForm Support

    Answered by jonathan on September 12, 2015 at 09:21 PM

    I was able to see the cut-off form when using mobile browser. The form cannot be submiitted when using mobile browser.

     

    Please allow me some time to investgate further and figure out a fixed.

    I will get back to you when I have update as soon as possible.

     

    Thanks.

  • Profile Image
    JotForm Support

    Answered by jonathan on September 18, 2015 at 10:54 PM

    I truly apologize for the delayed response. I am not sure what had happen why my previous response why it was not sent on this thread.

    I do remember getting back to this to update you on the issue. The last time I checked on your website, the it was no longer cut-off on the mobile browser view.

     

    Please let us know if there are still issue.

    Thanks.

     

  • Profile Image

    Answered by spokanebodybuilding on September 18, 2015 at 11:03 PM

    The button is appearing because we've changed the iframe height to 4400 I believe.  While it works for the mobile devices now, it also leaves a huge amount of blank space below the form in a web browser:

  • Profile Image
    JotForm Support

    Answered by jonathan on September 18, 2015 at 11:19 PM

    Thank you for the info. I noticed the excessive height as well on desktop browser.

    Can you please try using this iframe embed code instead http://pastie.org/10430385

    I omitted the script part of the code, and then set the height to only 3044px.

    Please try and let us know how it goes.

     

     

  • Profile Image
    JotForm Support

    Answered by jonathan on September 18, 2015 at 11:52 PM

    I created a test page here and I used the default WP embed code given by the Form Builder.

     

    this code

     

    <script type="text/javascript" src="//www.jotformpro.com/jsform/52608858091968"></script>

     

    Checking on desktop browser 

     

    and on mobile browser

     

    seems to be working.

    Can you please try also the default sript embed for the WP using the Form Builder.

    Hopefully this finally fixes the problem. Let us know if issue still persist.

     

  • Profile Image

    Answered by spokanebodybuilding on September 18, 2015 at 11:58 PM

    The problem that we had with the WP embed code before is that the calculator was not working consistently (would sometimes provide a total of 0.00 dollars).  This is the reason we were told to use iframe, because of the calculation errors (check my other help requests for this issue).

  • Profile Image
    JotForm Support

    Answered by jonathan on September 19, 2015 at 12:04 AM

    Thank you for reminding me about the previous issue on calculation due to script embed. I have missed it. 

    It was from this thread https://www.jotform.com/answers/530860

    Can you please test the calculation using my test page if the Calculation is still failing?

    Perhaps we can fix the calculation issue on the form, and still can use the script embed code of the form.

    I will wait for your updated response.

  • Profile Image

    Answered by spokanebodybuilding on September 19, 2015 at 12:52 AM

    I just tested it and had the error again.  On that one the "Classes Entered" field remained zero even while checking multiple class boxes.  Previously when we had the error it would correctly identify the number of classes but would not multiply to an total dollar amount.

  • Profile Image
    JotForm Support

    Answered by jonathan on September 19, 2015 at 02:15 AM

    I could not replicate the calculation problem on my test page and even on your own website page.

    Please take note that the embedded form on my test page is also your actual form http://www.jotformpro.com/form/51468406349966

     

    Can you please confirm that I was checking the right problem?

    Perhaps you can try re-embedding now the form to your website using its WP embed code and I will troubleshoot the form there if there are still issue.

    Thanks.