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

    My form works online but not when I embed it in my website

    Asked by Gustavo  on January 15, 2015 at 05:19 AM

    My form works properly in the online version, but when I try to test the embedded one it just displays but the functionality is broken: no validation, no submit,...

    I cannot post my URL here because the form is after a client login. 

    I've already tried all the ways to embed it in my code:

    - the one line script that creates an iFrame dynamically. Something like this: 

    <script type="text/javascript" src="//form.jotformeu.com/jsform/XXXXXXXXXX"></script>

    - the iFrame with the script below to control the height:

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

    - the iFrame without the script below:

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

    - The iFrame with sandbox attributes:

    <iframe sandbox="allow-same-origin allow-scripts allow-popups allow-forms" id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformeu.com/form/XXXXXXXXXX" frameborder="0" style="width:100%; height:20443px; border:none;" scrolling="no"></iframe>

     

    Any hints or workaround on this issue please?

    Note: I've replaced my form id with XXXXXXXXXX here in this post, but I got it right in my code.

     

    Thanks in advance.

    style POST height message
  • Profile Image
    JotForm Support

    Answered by Kiran on January 15, 2015 at 10:47 AM

    Hello Gustavo,

    As per the script provided by you, I see that you are using normal javascript embed method. I suspect that the other scripts on your website may be conflicting with the form embed code. In such case, you may try embedding the JotForm using iframe method.

    Please refer to the following guide that can help you in getting the iframe code to embed on your webpage.

    http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    Please get back to us if the issue still persists. We will be happy to help.

    Thanks!