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

    Bring Thank You Message On Top Of Page

    Asked by NetSpeedZ on August 01, 2013 at 02:25 AM

    i am having this same issue and have followed the suggestions and still cannot get it to work.  Below is the HTML from my page:
    <div class="wsb-htmlsnippet-element"><iframe id="JotFormIFrame"
    onload
    =self.scrollTo(0,0)" allowtransparency="true" src="http://form.jotform.us/form/41113639376152"
    frameborder
    ="0" style="width:100%; height:1317px; border:none;" scrolling="yes">
    </iframe></div>
    message Thank You message long form preview
  • Profile Image

    Answered by khrisell on August 01, 2013 at 03:03 AM

    Hello,

    Can I have the URL of the Website/Page where the form is located so that we could replicate the issue and address it properly?

    Thank you and I will wait for your response.

     

  • Profile Image

    Answered by NetSpeedZ on August 01, 2013 at 08:30 AM
    URL: http://www.romwarez.com/schedule.html
    ------------
  • Profile Image

    Answered by pinoytech on August 01, 2013 at 11:19 AM

    Hi,

    Sorry for the inconvenience that may have caused. Can you please try to re-embed your form code into your website using iFrame without the script code if that fixed the issue or not?

    Here's your form iFrame code:

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

    Thank you!

  • Profile Image

    Answered by NetSpeedZ on August 01, 2013 at 11:22 AM
    You will need to be more specific on what needs to be done, i.e, step by
    step process for performing your requested fix.
    ------------
  • Profile Image

    Answered by pinoytech on August 01, 2013 at 12:37 PM

    Hi,

    My apologies! With regards to the fix, please follow this simple steps:

    1. Get a fresh copy of your form's iFrame code.

    2. On your form code that you embed into your website, remove/delete it and replace with a new copy of your form's iFrame code without the <script> shown bellow </iframe>

    Here's your form iFrame code:

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

    Feel free to contact us again if you need further assistance.

    Thank you!

  • Profile Image

    Answered by NetSpeedZ on August 01, 2013 at 09:44 PM
    Tried what you suggested. Didn't work.
    Still have the same issue of when a form is completed, the form does not
    reset itself to top.
    ------------
  • Profile Image

    Answered by jefreylandicho on August 02, 2013 at 05:33 AM

    In the IFRAME code that was provided, please try replacing the onload="window.parent.scrollTo(0,0)" part with onload="self.scrollTo(0,0)"

    If it does not work, you might have to try creating your own custom url thank you page.

    If the issue still persist, please contact us again.

  • Profile Image

    Answered by NetSpeedZ on August 02, 2013 at 10:12 AM
    Your suggested change for the iFrame CSS code did not work.
    A custom URL is not an option as I want the Thank You message to appear on
    the same page as the form itself. It makes for a much cleaner process and
    less pages to manage.
    If the form displays properly on the JotForm preview, it should work when
    code placed on a live html page.
    ------------
  • Profile Image

    Answered by jefreylandicho on August 02, 2013 at 10:48 AM

    I have checked your website and it is still using onload="window.parent.scrollTo(0,0)". Can you please keep the code changes in your website while we do some testing. The code should be similar below

    <iframe id="JotFormIFrame"  onload="self.scrollTo(0,0)" allowtransparency="true" src="//www.jotform.us/form/32068254769160" frameborder="0" style="width:100%; height:878px; border:none;" scrolling="no"></iframe>

  • Profile Image

    Answered by NetSpeedZ on August 02, 2013 at 10:55 AM
    Your recommended CSS code is back on the web page.
    ------------
  • Profile Image

    Answered by khrisell on August 02, 2013 at 12:16 PM

    May we know if it is working now after seeing the code on your website/page?

  • Profile Image

    Answered by NetSpeedZ on August 02, 2013 at 12:19 PM
    No, it is not working. I tested the code you gave me and changed back when
    it didn't work.
    ------------
  • Profile Image
    JotForm Support

    Answered by Mike_T on August 02, 2013 at 05:14 PM

    It seems that the scrolling is not working right due to  overflow:scroll value on parent div.

    Please try to change the code on your page from:

    <div id="Html1" style="position:absolute;overflow:scroll;left:285px;top:9px;width:487px;height:580px;z-index:1">
    <iframe id="JotFormIFrame" onload="self.scrollTo(0,0)" allowtransparency="true" src="//www.jotform.us/form/32068254769160" frameborder="0" style="width:100%; height:878px; border:none;" scrolling="no"></iframe>
    </div>

    to the following:

    <div id="Html1" style="position:absolute;left:285px;top:9px;width:487px;height:580px;z-index:1">
    <iframe id="JotFormIFrame" onload="self.scrollTo(0,0)" allowtransparency="true" src="//www.jotform.us/form/32068254769160" frameborder="0" style="width:100%; height:100%; border:none;" scrolling="yes"></iframe>
    </div>

    I hope it will solve the scrolling issue on the page.

  • Profile Image

    Answered by NetSpeedZ on August 02, 2013 at 06:29 PM
    That seemed to do it. I actually had that div defined as you changed it,
    however, when your CSS code didn't work, I left it as it was and did not
    change it when you gave me the new CSS code.
    I'll test further.
    Appreciate the assistance.
    J.A. Clark
    ------------
  • Profile Image
    JotForm Support

    Answered by jonathan on August 02, 2013 at 07:56 PM

    @ NetSpeedZ

    Hi,

    Please update us later also of your results. Inform us if the issue persist.

    Thanks.

  • Profile Image

    Answered by scottdever on May 01, 2014 at 09:01 AM

    i am having this same issue and have followed the suggestions and still cannot get it to work.  Below is the HTML from my page:

    <div class="wsb-htmlsnippet-element"><iframe id="JotFormIFrame"
    onload
    =self.scrollTo(0,0)" allowtransparency="true" src="http://form.jotform.us/form/41113639376152"
    frameborder
    ="0" style="width:100%; height:1317px; border:none;" scrolling="yes">
    </iframe></div>