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

    Form pops to top of page when required field is left blank

    Asked by jdjackson7 on March 02, 2015 at 02:48 PM

    Our form has 3 fields - all required.  When a user presses Submit when a required field is empty, the form jumps to the top of the page. The user has to scroll back down to find the form. He then sees the This field is required. message.

    How can we stop the form from jumping to the top of the page? 

    Thanks

    Page URL:
    https://www.spellboundrx.com/2015/Contact-Us/

    required field error scrolling
  • Profile Image
    JotForm Support

    Answered by Mike on March 02, 2015 at 03:32 PM

    Thank you for contacting us.

    There are two forms on your web page, could you please try to embed at least one of them with an iFrame embedding method?

    Getting the Form iFrame Code

    Does it make any differences?

  • Profile Image

    Answered by jdjackson7 on March 02, 2015 at 03:53 PM

    We replaced the main form in the body with iframe. Both forms in the body and the on on the right side bar still jump up.  

  • Profile Image

    Answered by Ben on March 02, 2015 at 04:45 PM

    Please do try changing this:

    <iframe id="JotFormIFrame" frameborder="0" scrolling="no" style="width:100%; height:370px; border:none;" src="https://secure.jotform.us/form/50483588238162" allowtransparency="true" onload="window.parent.scrollTo(0,0)"></iframe>

    to

    <iframe id="JotFormIFrame" frameborder="0" scrolling="yes" style="width:100%; height:400px; border:none;" src="https://secure.jotform.us/form/50483588238162" allowtransparency="true"></iframe>

    and the second one from:

    <script src="https://secure.jotformpro.com/jsform/50587472085967" type="text/javascript">

    to

    <iframe id="50587472085967" frameborder="0" scrolling="no" style="width: 100%; border: medium none; height: 134px;" name="50587472085967" allowtransparency="true" src="https://secure.jotformpro.com/form/50587472085967"></iframe>

    Do let us know how it goes once you do.

  • Profile Image

    Answered by jdjackson7 on March 02, 2015 at 05:39 PM

    Made your changes and have the same issues.  Plus, because the second form expands with hidden fields, you cannot assign a height. 

  • Profile Image
    JotForm Support

    Answered by Mike on March 02, 2015 at 05:49 PM

    We have a 'nojump' option, so please add it to the form URLs to see if that helps.

    <iframe id="JotFormIFrame" frameborder="0" scrolling="yes" style="width:100%; height:400px; border:none;" src="https://secure.jotform.us/form/50483588238162?nojump" allowtransparency="true"></iframe>

    <iframe id="50587472085967" frameborder="0" scrolling="no" style="width: 100%; border: medium none; height: 134px;" name="50587472085967" allowtransparency="true" src="https://secure.jotformpro.com/form/50587472085967?nojump"></iframe>

    You can also adjust the iFrame's height values in pixels to fix the height issue.

    Thank you.

  • Profile Image

    Answered by jdjackson7 on March 02, 2015 at 07:04 PM


    I'm sorry but that still does not take care of the jumping problem.  Please check it ou here...

    https://www.spellboundrx.com/2015/Contact-Us/index6.html

     

     

  • Profile Image

    Answered by mayur5478 on March 02, 2015 at 10:34 PM

    The problem might be that normal operation might not get suppressed on click of submit button.To fix it , return false on click of submit button. This would suppress the normal operation . Hope that helps.

    Thanks ,

    Mayur

  • Profile Image
    JotForm Support

    Answered by Charlie on March 02, 2015 at 10:55 PM

    Hi,

    You could also try adding this code to your <head></head> part of your page where the forms are embedded.

    <script type="text/javascript">

      $.noConflict();

    </script>

     You can learn more about it here: http://api.jquery.com/jquery.noconflict/.

    Do let us know if this works.

    Thank you.