Forward and Back Tabs

  • utvmasters
    Asked on July 7, 2015 at 1:12 PM

    I am trying to see if there is a way to complete 2 items

    1) Clicking the next tab only takes you to the bottom of the form on the next page. is there a way to get to the top of the form?

    2) When clicking back on a form not all of the info is retained and requires inputting it again
    .

     

     

  • KadeJM
    Replied on July 7, 2015 at 2:24 PM

    To my understanding you appear to be having two different issues with your form so lets go ahead and take a look at your first issue on this thread here involving form going to top of the next page.

    And as for your secondary issue with retaining the information I have moved that over here so that we can look at it separately.

    Anyhow though, I checked the next page going to the top of the page after clicking "next button" and I noticed on your standalone form this is working properly which usually means it's not the form causing the issue.

     

    Forward and Back Tabs  Image 1 Screenshot 30

    However, when I checked this again on your embedded form I noticed this was the opposite and I can confirm that there it doesn't go to the top of the next page like it should. I believe there's a conflict or something may be missing that would make it function properly.

    Forward and Back Tabs  Image 2 Screenshot 41

    It appears you are using just the iframe. 

    Can you try using the iframe + script to see if that makes any difference?

    Example:

    <iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://secure.jotform.us/form/51756786960168" frameborder="0" style="width:100%; height:12451px; 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;case "collapseErrorPage":if (iframe.clientHeight > window.innerHeight) {iframe.style.height = window.innerHeight + "px";}break;case "reloadPage":window.location.reload();break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    Alternatively, you could try modifying the iframe code and adding ' #top ' to the end of it if the first way doesn't work.

    Example: 

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

     

     

     

  • utvmasters
    Replied on July 7, 2015 at 5:13 PM
    Great thank you all works perfect now
    ...