Why the wordpress embedded form is not advancing properly?

  • Profile Image
    DoSocial
    Asked on August 10, 2017 at 01:27 PM

    Hello,

     

    We have created form and integrate breadcrumbs for multi page widget which dont work properly when integrated on wordpress website.

    Here is the link of the page:

    https://dosocial.me/en/sign-up-monthly

     

    The problem is that when form is filled and go to next page (by clicking on next button - in our case "Two steps left" button, the numbers on breadcrumbs dont change.

     

    Maybe there is any solution to fix this problem!?

  • Profile Image
    Nik_C
    Answered on August 10, 2017 at 01:40 PM

    I tested the form directly and the steps are advancing properly.

    So it is related to how the form is embedded.

    I'm not sure how did you embed your form, but please try re-embedding it by using one of these solutions:

    https://www.jotform.com/help/174-Embed-JotForm-in-Wordpress-using-the-Embed-Form-Plugin

    https://www.jotform.com/help/299-How-to-embed-a-form-to-Wordpress-com

    https://www.jotform.com/help/4-Adding-Forms-to-Wordpress-org-Version

    If the issue persists please let us know.

    Thank you!

     

  • Profile Image
    DoSocial
    Answered on August 10, 2017 at 03:13 PM

    Hi Nik_C,

     

    Thanks for your fast reply. I have made the it as was described in instructions and still same result.

    The form is working great, what is not working correctly is breadcrumbs ONLY when it is integrated on website.

     

    Maybe you can advice me what to do?

    Thanks in advance

  • Profile Image
    Nik_C
    Answered on August 10, 2017 at 03:33 PM

    Could you please try re-embedding your form by using the below code:

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

    It is an iFrame embed method.

    Please try and let us know if that made any difference.

    Thank you!

  • Profile Image
    DoSocial
    Answered on August 10, 2017 at 06:51 PM

    Sorry Nik, It dont help.

    here is the printscreen what we got, it even dont show the next button in this version.

  • Profile Image
    Welvin
    Answered on August 10, 2017 at 07:19 PM

    Please try the following embed codes, the full iframe with scripts. You are currently not embedding the form on this method. Please try it and update us here so we can check the status.

    <iframe id="JotFormIFrame-72056751968467" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.me/72056751968467" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe> <script type="text/javascript"> var ifr = document.getElementById("JotFormIFrame-72056751968467"); if(window.location.href && window.location.href.indexOf("?") > -1) { 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; } } window.handleIFrameMessage = function(e) { var args = e.data.split(":"); 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); } </script>

  • Profile Image
    John_Benson
    Answered on August 10, 2017 at 08:36 PM

    You need to use a new iFrame code for the other form to work properly. To get the iFrame code of your form, please follow this guide: https://www.jotform.com/help/148-Getting-the-form-iFrame-code

    Here's a quick screen animation guide:

    I hope that helps. If you need further clarifications or have questions, please let us know.

  • Profile Image
    DoSocial
    Answered on August 11, 2017 at 07:36 AM

    Ok thanks a lot!)