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

    Forms getting cut off in Explorer, Firefox and mobile browsers

    Asked by touchbroward on October 24, 2013 at 11:11 AM

    Hi, a big problem was brought up to my attention by a user on our website.  We've got an online form that's getting cut off after the first 3 to 5 fields when viewed using Internet Explorer, Firefox, Mobile Safari and Mobile Chrome (these are just the ones I've been able to check)

    The form seems to be working only in Desktop Chrome and Safari

    I've a attached a screenshot of the issue. You can see the form in the URL below, as well.

    Please advise, we need to have this fixed asap.

    Thanks

    Page URL:
    http://touchbroward.org/partner-events

    Screenshot
    Mobile online form problem check
  • Profile Image

    Answered by pinoytech on October 24, 2013 at 12:26 PM

    Hi,

    Sorry for the inconvenience that may have caused. Upon checking your website where your form is embedded, I found out that the issue is had something to do with your form's iframe height which is only 433px. Increasing the height of your form's iframe height should fixed the issue.

    Feel free to contact us again if you need further assistance.

    Thank you!

  • Profile Image

    Answered by touchbroward on October 24, 2013 at 01:22 PM

    Actually, it's stranger than that...

    1. Whe I examine the actual HTML of the iframe that I copy and pasted into the page it says Height: 1873px (see pic below)

    Actual HTML

     

    2. On Chrome it displays properly, when I inspect the form like you did, it says Height: 1818px (see pic below)

    Chrome

     

    3. On Firefox (and the others I mentioned), it cuts the form off. And when I inspect the element it showing a Height: 426px! (see pic below)

    Firefox

     

    The actual HTML is fine... yet it displays an insufficient height for the iframe on Explorer, Firefox, etc...

    ??????

    Thanks

     

     

  • Profile Image

    Answered by EliezerN on October 24, 2013 at 02:42 PM

    Thanks for contacting us.

    I took the iFrame code of your form and I was able to see that the height value is 1914px, so it should not presents any issues. But I also embeded the iframe code of your form to my test webpage but I was not able to reproduce the issue when using FireFox:

    The form displays with no issues while using Chrome, IE.

    I would recommend you to add !important after the height value, so it must be like this 1914px !important, that might help. Enabling Scrolling function might also help to resolve the issue:

    I hope this helps. Feel free to contact us if you need fuerther assistance.

    Thanks

  • Profile Image

    Answered by touchbroward on October 24, 2013 at 03:17 PM

    I think I found the problem... There's two Jotforms on that page.  The main one, and the small email sign-up form in sidebar.  As soon as I removed the sidebar the form displays properly...

    Is that a known issue? having two forms on same page?

  • Profile Image
    JotForm Support

    Answered by Welvin on October 24, 2013 at 05:50 PM

    Hi,

    Thanks for letting us know the caused of the issue. Probably a conflict with your website script, specially, for both the script tags found in your iFrame Codes. Please try removing that one, so...

    FROM:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotform.co/form/32315302111837" frameborder="0" style="width:100%; height:1883px !important; border:none;" scrolling="no"></iframe>

    <script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight":iframe.style.height = args[1] + "px";break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    TO:

    <iframe id="JotFormIFrame" allowtransparency="true" src="//form.jotform.co/form/32315302111837" frameborder="0" style="width:100%; height:1883px !important; border:none;" scrolling="no"></iframe>

     

    Let us know if this resolves the issue.

    Thanks