How to stop page from "auto scrolling" when going to 2nd page of form.

  • Profile Image
    goquote
    Asked on October 07, 2016 at 07:05 AM

    I used to be able to take a bit out of the embed code (iFrame), but the code looks different now. When I did the page would not scroll when the ORANGE BUTTON was clicked (to take you to the next page)

    This is the code:

    <iframe id="JotFormIFrame-62654408196967" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/62654408196967" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe> <script type="text/javascript"> window.handleIFrameMessage = function(e) { var args = e.data.split(":"); var iframe = false; if (args.length > 2) { iframe = document.getElementById("JotFormIFrame-" + args[2]); } else { iframe = document.getElementById("JotFormIFrame"); } if (!iframe) return; switch (args[0]) { case "scrollIntoView": iframe.scrollIntoView(); break; case "setHeight": iframe.style.height = args[1] + "px"; break; case "collapseErrorPage": if (iframe.clientHeight > window.innerHeight) { iframe.style.height = window.innerHeight + "px"; } break; case "reloadPage": window.location.reload(); break; } var isJotForm = (e.origin.indexOf("jotform") > -1) ? true : false; if(isJotForm && "contentWindow" in iframe && "postMessage" in iframe.contentWindow) { var urls = {"docurl":encodeURIComponent(document.URL),"referrer":encodeURIComponent(document.referrer)}; iframe.contentWindow.postMessage(JSON.stringify({"type":"urls","value":urls}), "*"); } }; if (window.addEventListener) { window.addEventListener("message", handleIFrameMessage, false); } else if (window.attachEvent) { window.attachEvent("onmessage", handleIFrameMessage); } if(window.location.href && window.location.href.indexOf("?") > -1) { var ifr = false; if (args.length > 2) { ifr = document.getElementById("JotFormIFrame-" + args[2]); } else { ifr = document.getElementById("JotFormIFrame"); } var get = window.location.href.substr(window.location.href.indexOf("?") + 1); if(ifr && get.length > 0) { var src = ifr.src; src = src.indexOf("?") > -1 ? src + "&" + get : src + "?" + get; ifr.src = src; } } </script>

     

    This is the page it is currently embedded on:

    http://www.gotreequotes.com/tree-services-florida

     

    Thanks Ben

  • Profile Image
    Boris
    Answered on October 07, 2016 at 11:19 AM

    To prevent a form from jumping when clicking on its Page Break buttons, you can add ?nojump parameter at the end of the URL in its embed codes. For example, if the start of the iFrame embed codes you are using is this:

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

    You would change it into this:

    <iframe id="JotFormIFrame-62654408196967" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/62654408196967?nojump" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe>

    That alone will fix the problem when there is only one type of the embed codes used on the page. However, on the site you have linked to, the same form (62654408196967) is embedded two times - once with the iFrame embed code (the one near the top), and once with the JavaScript embed codes (the one near the bottom). There is also a second form embedded with the script embed codes, form 62064424326955.

    If you want to prevent your forms from jumping when clicking on the Page Break button, please try adding the ?nojump parameter at the end of the URL inside each of the three embed codes. Please let us know how it goes.