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

    Preview Before Submit: Preview remains above the currently viewed area of the page

    Asked by melodicsounds on February 23, 2016 at 11:54 PM

    In this form: https://form.jotform.com/60527500792959 I have the preview widget... works fine but since the form is really long when you preview it let you on the exact point you stayed before clicking "Preview" so it looks like its all white but actually you are now in the preview but it is on top (since its smaller now). Is there any way we can fix this? Like when clicking preview it takes you to the top of the page?

    Page URL:
    https://form.jotform.com/60527500792959

    preview JotForm all preview widget
  • Profile Image
    JotForm Support

    Answered by Boris on February 24, 2016 at 08:22 AM

    I have checked your form through the direct link you provided, and upon filling it out and clicking on the Preview/Revisar button, the Preview that appears is still visible:

    Is your form perhaps embedded somewhere when you are experiencing the issue?

    I'm afraid that the Preview Before Submit widget is currently not able to scroll the page automatically to the start of the page when it is clicked. This is why you could experience such a problem on an embedded form, as your users scroll down to below the point where this widget is visible.

    If your form is always of a similar height, we could try working around this issue by using some custom CSS:

    #previewContainer { padding-top: 650px; }

    This will add a blank area above the preview container, which will make sure that the preview container is pushed down into the visible area of the embedded form. You can add custom CSS by opening your form in the Designer, and pasting the codes into the textbox under the CSS tab:

    Please let us know if this workaround is something that could work in your case.

  • Profile Image

    Answered by melodicsounds on February 24, 2016 at 11:20 AM

    Yes sorry, the direct link works just fine! But please recreate what I am saying in my MAIN form: https://form.jotform.com/60415836657967 Use Ensayo/Trabajo sobre Libro since those are the longest ones please and let me know your thoughts/solutions.

  • Profile Image
    JotForm Support

    Answered by Boris on February 24, 2016 at 12:47 PM

    I see, the form with Preview Before Submit is embedded inside another form, and the iFrame in which this form is embedded is set to be 2500 pixels high:

    When your users scroll all the way down to click on the preview button, they are about 2000 pixels down the form - and the preview needs only about 700 pixels to be displayed. I would recommend using the same workaround as posted above, but for your Ensayo form, use 1300px as the padding-top:

    #previewContainer { padding-top: 1300px; }

    For your Trabajo sobre Libro form, I would recommend using 1100px:

    #previewContainer { padding-top: 1100px; }

    You will have to edit each of these forms separately, and add their CSS code to them. Please follow the same instructions as in the previous reply on how to add the CSS code to your forms, and let us know if this makes your Preview Before Submit widgets appear near the place where the Preview/Revisar button was clicked.

  • Profile Image

    Answered by melodicsounds on September 12, 2016 at 06:00 PM

    Hey! I have this problem but not with the preview, instead with the Thank You message that you guys offer.

    How to add a padding top to that Thank You message?
  • Profile Image
    JotForm Support

    Answered by liyam on September 12, 2016 at 09:11 PM

    Hello, 

    Since your follow-up question is no longer related to the title of the thread, I have moved it to a new one, which can be found here. We'll respond to your question in a short while.

    Thanks.

  • Profile Image
    JotForm Support

    Answered by Kiran on September 13, 2016 at 07:29 PM

    @melodicsounds,

    Somehow your response is not posted in the thread. However, since the issue with the Thank you page it is moved to a separate thread and I notice that the issue is already addressed by one of our colleagues. If you have any questions with the issue, we request you to follow-up on the other thread.

    Thank you!