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

    Clicking "Next" button in multiple page form scrolls page to top of form.

    Asked by magicflight on April 28, 2012 at 02:14 PM

    Here is the form in question: http://www.magic-flight.com/contactdev.php

    This issue happens in Firefox and Safari for Mac, it does not happen in Chrome.  Whenever the user makes a selection and then clicks "next" to move on to the next page of the form, it automatically scrolls down to meet the top of the form.  I realize this may be an issue with the existing code on the website since it doesn't happen in Chrome, but if there was a different embed method I could use or an easy fix you knew of it would be greatly appreciated. Thanks!

    Page URL:
    http://www.magic-flight.com/contactdev.php

    scroll next different Selection embed method
  • Profile Image
    JotForm Support

    Answered by jonathan on April 28, 2012 at 04:59 PM

    Hello,

    Can you please try using the iframe method for embed. And see if it make the difference.

    Guide: How-to-get-your-Form-s-Iframe-Code

    Please update us on this. Thanks.

  • Profile Image

    Answered by magicflight on April 28, 2012 at 05:19 PM

    Updated with the iFrame code, the issue persists. The only thing I changed within the iframe code was the height, from 5293px to 100% to prevent our footer from being 5000px too far down the page.  The issue persisted with the height set to pixels rather than a percentage as well. Any other suggestions?  

  • Profile Image
    JotForm Support

    Answered by jonathan on April 28, 2012 at 05:59 PM

    In the iframe code for embed, can you please add this onload="scrolltotop()" in the parameters.

    And also, it seems your form is not displaying correctly now on FF or IE, I tried checking it, and the form is cut-off. Probably had to do with the height setup.

    Will await your update. Thanks.

  • Profile Image

    Answered by magicflight on April 29, 2012 at 05:40 AM

    Just added the parameter, issue still persists. I just tried it in FF and it is definitely broken.  

    Some parts of the form can become quite large depending on selections so I'd prefer not to have to set the height to a contant. It could just be the existing code on the site, i'll look into it.

  • Profile Image

    Answered by pinoytech on April 29, 2012 at 08:52 AM

    Hi,

    First of all, sorry for the inconvenience that may have caused. I will now assign this to our next level support and we will keep you update regarding on this issue.

    Thank you for using JotForm!

  • Profile Image
    JotForm Support

    Answered by jonathan on April 29, 2012 at 10:07 AM

    @magicflight,

    You are actually right. The existing other scripts on your page, particularly that of your theme which is using jquery, is conflicting with jotform scripts. You can easily identify this because if you embed the form to another page without any other scripts, it work just fine.

    I've been testing your form on different method, but the most I can come up with for now is the iframe method and with the 'scrolling=yes' enabled and a fix height of 400px.

    <iframe allowtransparency="true" onload="scrolltotop()" src="//form.jotform.us/form/21030794716148" frameborder="0" style="width:100%; height:400px; border:none;" scrolling="yes"></iframe>

    I have the form here. I use the source code of your form.
    Hope this add-on helps on your sorting this out. Please contact us if you require further assistance or you come with idea/suggestion to resolve this. Thanks.
  • Profile Image
    JotForm Support

    Answered by liyam on April 29, 2012 at 10:23 AM

    I have a different approach on this.

    Please add nojump to the URL parameter if this would work.

    Example:

    <script type="text/javascript" src="//www.jotform.com/jsform/1234567890?nojump"></script>

  • Profile Image

    Answered by magicflight on May 09, 2012 at 02:37 PM

    ?nojump was the ticket!  Thanks again for your amazing support. 

  • Profile Image

    Answered by pinoytech on May 09, 2012 at 02:51 PM

    You're welcome. If you need further assistance, please don't hesitate to contact us again anytime.

    Thank you for using JotForm!

  • Profile Image

    Answered by magicflight on May 14, 2012 at 07:00 PM

    Another issue has come up.  When using the ?nojump parameter it solves the initial problem of the page scrolling, but since using it, all updates i've made to the form do not take effect. 

    If you look at the form embedded where it will be used, it looks like this (the page currently has the ?nojump parameter): http://www.magic-flight.com/contactdev.php 

    The real form should look like this: http://form.jotform.us/form/21030794716148, take note of the order and wording of the "Choose department" option. 

    When I remove the ?nojump parameter from the form embedded on the first link, it updates and shows the most up-to-date form, but then the scrolling issue occurs again.  I commented out all scripts and formatting and tried it without the ?nojump and it still jumped to the top of the form.  I have tried it in multiple browsers and they all behave the same.  Removing ?nojump makes the form up to date, but the form jumps. With ?nojump, the form is an old version, but it behaves normally. Any advice would be greatly appreciated.  Thanks!

  • Profile Image
    JotForm Support

    Answered by jonathan on May 14, 2012 at 07:39 PM

    @magicflight,

    Can you please try updating the link from 

    "http://form.jotform.us/jsform/21030794716148?nojump"

    to

    "http://www.jotform.us/jsform/21030794716148?nojump"

    See if it will make an update.
    I think there was a problem the form.jotform.us today.

    Please update us.

    Thanks.


  • Profile Image

    Answered by magicflight on May 14, 2012 at 08:07 PM

    Resolved!  Thanks!

  • Profile Image
    JotForm Support

    Answered by jonathan on May 14, 2012 at 08:10 PM

    Good! =) Thank you for updating us.

  • Profile Image

    Answered by colinhiscock on August 15, 2014 at 04:54 AM

    Hello.  I am having the same problem and have tried adding the ?nojump command but it's not working.  The form isn't live yet as I can't put it live with this issue.  The code I'm using is:

     

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

    </div>

  • Profile Image

    Answered by colinhiscock on August 15, 2014 at 04:55 AM

    Ha, fixed it - deleted the second half of that code!!  Was a script convict obviously.

     

    Thanks