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

    Hitting 'next' button to change page is working erratically

    Asked by Consono on October 13, 2014 at 11:33 AM

    I am getting reports from my users that sometimes the next button in the page break does not function and they cannot get on to the next page.  There are different devices involved: Ipad, Windows7 PC.  

    next Reports ipad pc next button
  • Profile Image
    JotForm Support

    Answered by Welvin on October 13, 2014 at 01:33 PM

    Hi,

    I'm sorry to know that. Please try re-embedding the form using our iFrame method: http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code. If the problem is caused by a script conflict, our iFrame method would help you fix it. A script conflict happens when you embed your form using the default Javascript Method. 

    If the issue persists after changing your embed method, please let us know here and don't forget to include the website URL so we can test it.

    Thank you!

  • Profile Image

    Answered by Consono on October 18, 2014 at 07:15 PM

    Thanks Welvin, but this was unsuccessful.  I did have the form embedded as Java.   I replaced it with the iFrame code, and the first 3 pages of the form were fine.  However, page 4 of the form cut off at item 12 of a list of 18, with no way to access the other items or move to the next page.

    I have put javascript back as that worked for some, this won't work for anyone.

    Any thoughts?

    http://form.jotformeu.com/form/40945693057362

  • Profile Image

    Answered by Ben on October 19, 2014 at 06:14 AM

    Hi,

    Thank you for updating us.

    Now, you should restore back the iFrame method that was recommended by my colleague Welvin. The fact that you did not see all of the items on the page 4 confirms that there are some script conflicts because the default iFrame embed method adjusts its size according to the jotform, but requires that second <script> </script> part that is outside of the iframe and is in turn susceptible to conflicts.

    What I would suggest is to do next:

    Grab the iFrame code. Remove the <script></script> part so that you only have <iframe></iframe> and then set the height of iframe to 825px (this is only a guess since we must see it on the website to know exact size).

    OK, so to demonstrate:

    original iframe embed code:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformeu.com/form/40945693057362" frameborder="0" style="width:100%; height:350px; 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>

    We will now strip the <script></script> part so we stay with <iframe></iframe> part only, like so:

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

    OK, so this is what we want, now just to adjust the height to 825px:

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

    That is it.

    If the jotform has more space than needed on the 4th page, or if it is missing a few pixels, just alter the height accordingly and re-embed your jotform.

    This should work for you now, but do let us know how it goes.

    Best Regards,
    Ben

  • Profile Image

    Answered by Consono on October 19, 2014 at 03:18 PM

    Thanks Ben.  That worked a treat.

  • Profile Image
    JotForm Support

    Answered by Kiran on October 19, 2014 at 06:39 PM

    We are glad that the solution provided by our colleague worked for you. It's our pleasure to assist you. 

    Please do not hesitate to get in touch with us if you have any other questions. We will be happy to help.

    Thank you for using JotForm.