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

    How to prevent vertical "jumping" on embeded form?

    Asked by TeckStyle on June 23, 2016 at 01:53 PM
    I added the ?nojump to the (jotform)URL and it works, but is there any inject CSS we can add so we can prevent the vertical jump in an embedded feature?
  • Profile Image
    JotForm Support

    Answered by BJoanna on June 23, 2016 at 02:04 PM

    How did you embedded your form? Please provide us URL of your embedded form so that we can inspect and test your form. 

    If you have embedded your form with script code you can add ?nojump at the and of form URL of your script code.

    Example:

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

    In case that you have embedded your form with iFrame code remove onload="window.parent.scrollTo(0,0)"  in the iframe code and add ?nojump at the end of the form URL. 

    Example:

       <iframe

          id="JotFormIFrame"

          allowtransparency="true"

          src="https://form.jotform.com/1234567890?nojump"

          frameborder="0"

          style="width:100%;

          height:539px;

          border:none;"

          scrolling="no">

        </iframe>

    Hope this will help. Let us know if you need further assistance. 

  • Profile Image

    Answered by TeckStyle  on June 23, 2016 at 03:25 PM

    I dont have a url to the form script to add ?nojump to.

    in the source code I have:

    <script src="https://cdn.jotfor.ms/static/prototype.forms.js" type="text/javascript"></script>

    <script src="https://cdn.jotfor.ms/static/jotform.forms.js?3.3.13940" type="text/javascript"></script>

    <script src="https://cdn.jotfor.ms/js/paypal.js?v=3.3.13940" type="text/javascript"></script>

     

    <script src="https://cdn.jotfor.ms/js/vendor/math-processor.js?v=3.3.13940" type="text/javascript"></script>

     

     

     

    <form class="jotform-form" action="https://submit.jotformpro.com/submit/61743312517956/" method="post" name="form_61743312517956" id="61743312517956" accept-charset="utf-8">

      <input type="hidden" name="formID" value="61743312517956" />

      <div class="form-all">

  • Profile Image
    JotForm Support

    Answered by BJoanna on June 23, 2016 at 04:11 PM

    Did you embedded your form with full source code? Can you please try to re-embed your form with iFrame code and add ?nojump at the end of the form URL. 

    Inside of this guide you can find how to get iFrame code of your form: 

    https://www.jotform.com/help/148-Getting-the-form-iFrame-code 

    Also please provide us URL of your website. 

    If you are using standalone form just add ?nojump at the end of the form URL. I have tested your form http://www.jotformpro.com/form/61743312517956 and I saw that form jumps when collapse fields are closed and opened. I think this is related to CSS code that you added to your form. 

    Other possible workaround would be to embed your form inside of some other blank form with iFrame Embed widget. 

    Here is my demo form: https://form.jotform.com/61746332225957 

  • Profile Image

    Answered by TeckStyle  on June 23, 2016 at 04:18 PM

    I cannot use the iframe method because I need to add some lines of script to the source before embedding.

    I see your duplicate of the form is not jumping when form collapse are clicked, what css did you remove for this fix?

  • Profile Image
    JotForm Support

    Answered by BJoanna on June 23, 2016 at 04:35 PM

    First I have cloned your original form to my account. Then I got the link of my cloned form and added ?nojump at the of the form URL. This is the link I got:

    https://www.jotform.com/form/61745707085966?nojump 

    Then I created new blank form and added iFrame Embed widget to my new blank form. I have then added link of my cloned form inside of iFrame Embed widget and I have set height and width of that widget.

    Link of the form i provided you https://form.jotform.com/61746332225957  is the link of my new form with iFrame embed widget.

    Feel free to clone it.

    I did not remove any CSS code form your original form. 

  • Profile Image

    Answered by TeckStyle  on June 23, 2016 at 05:08 PM

    but the iframe feature is not an option as I need to add script to the source.

  • Profile Image
    JotForm Support

    Answered by Boris on June 23, 2016 at 06:20 PM

    So you are using the customized source code of your form, and you wish to prevent the form from jumping. Yes, this is easily achievable, even with the source code embed method.

    What adding the ?nojump URL parameter to the regular link of the form does, is interpreted in the following JavaScript file:

    https://cdn.jotfor.ms/static/jotform.forms.js?3.3.13940

    If you take a look there, you can see that all the ?nojump parameter did was it set the value of JotForm.noJump to true. So to create the same effect in your customized source code, please simply add this small bit of JavaScript inside one of your existing scripts on the form, preferably near the bottom:

    JotForm.noJump = true;

    If you are not sure where to add this line of code, you can search for the last script on your form, which will look something like this:

    <script type="text/javascript">
    document.getElementById("si" + "mple" + "_spc").value = "12345678901234-12345678901234";
    </script>

    Simply edit it to include the new line of the code, so it would look something like this:

    <script type="text/javascript">
    document.getElementById("si" + "mple" + "_spc").value = "12345678901234-12345678901234";
    JotForm.noJump = true;
    </script>

    Please let us know how it goes.

  • Profile Image

    Answered by TeckStyle  on June 23, 2016 at 07:04 PM

    no, unfortunately that didn't work. It is still jumping when collapse is clicked

     

     

      <script type="text/javascript">

        document.getElementById("si" + "mple" + "_spc").value = "61743312517956-61743312517956";JotForm.noJump = true;

     

      </script>

  • Profile Image
    JotForm Support

    Answered by Kiran on June 23, 2016 at 08:09 PM

    Is it possible for you to add ?nojump parameter to the web page URL where the form is being embedded.

    Here is the form that I cloned your JotForm and grabbed the source code to embed on an HTML page.

    https://shots.jotform.com/kiran/shared/868131/868131.html

    The form in the URL is jumping normally. However, when you add ?nojump to the URL it doesn't.

    https://shots.jotform.com/kiran/shared/868131/868131.html?nojump

    If that doesn't help, let us know. I'm also looking for other solution. Once I found any information that helps, I'll let you know here.

     

    Thanks!

  • Profile Image

    Answered by TeckStyle  on June 24, 2016 at 05:30 AM

    No I don't have access to add ?nojump to the url.

  • Profile Image

    Answered by on June 24, 2016 at 06:01 AM

    I just tried inserting JotForm.noJump = true; to other script in the source like below...

     

        });

        JotForm.clearFieldOnHide = "disable";

        JotForm.onSubmissionError = "jumpToFirstError";

          JotForm.noJump = "true";

      });

     

    </script>

     

     

    that doesn't work.

  • Profile Image
    JotForm Support

    Answered by Nik_C on June 24, 2016 at 08:08 AM

    We'll try to find some other solution for you, since I ended the same like my colleagues, adding ?nojump to the URL of the form will prevent jumps:

    We'll try to find some other solution for you.

    Thank you.

  • Profile Image

    Answered by TeckStyle  on June 29, 2016 at 08:43 AM

    thank you for your help so far....

    Is there a fix or workaround for this yet please?

  • Profile Image
    JotForm Support

    Answered by Chriistian on June 29, 2016 at 09:54 AM

    We are still currently checking your form and finding the solution. I will get back to you once I found a workaround regarding this issue.

  • Profile Image
    JotForm Support

    Answered by Chriistian on June 29, 2016 at 10:33 AM

    Can you try to add this jQuery script in you code to fix the jumping issue?

    <script>

    $(document).ready(function() {   

      JotForm.noJump = true;

    });

    </script>

    You can add it at the bottom of your html code. After including jQuery file.

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>

     

  • Profile Image

    Answered by TeckStyle  on June 29, 2016 at 10:43 AM

    works like a charm.

    excellent work, thank you :)

  • Profile Image
    JotForm Support

    Answered by liyam on June 29, 2016 at 11:51 AM

    On behalf of the team, you are welcome, TeckStyle.

    Feel free to let us know if you have other questions.

    Thanks.