Why my embedded form is cut off?

  • restrenauto
    Asked on January 14, 2017 at 7:09 PM

    Hello

    My problem happens when I insert the HTML code on my page. When I open the page it looks like this:

    Why my embedded form is cut off? Image 1 Screenshot 20

     

     

    As you will realize the form is totally lost. I need your help. Work with webplus x8.

  • Jan
    Replied on January 15, 2017 at 10:05 AM

    The screenshot shows that the form is embedded on the right side. However, I can see that it is cut-off, the submit button is not showing.

    I can see that this form is not yet uploaded in your web server. Please try to re-embed the form using the iFrame method. This will prevent script conflicts between the form and the webpage. Here's a guide: https://www.jotform.com/help/148-Getting-the-form-iFrame-code.

    If it is still the same, then please try to remove the script element below the iFrame code. Here's an example: 

    Why my embedded form is cut off? Image 1 Screenshot 20

    If none of these works, I would suggest you upload the webpage first to your server so that we can check the source code.

    Hope that helps. Thank you.

  • restrenauto
    Replied on January 15, 2017 at 10:39 AM

    buenos dias:

     

    este es el codigo Iframe:

     

    <iframe id="JotFormIFrame-70104846408655" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformz.com/70104846408655" 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>

     

    seria tan amable de decirme como quedaría. realmente no le entiendo muy bien.

     

    Gracias.

  • Nik_C
    Replied on January 15, 2017 at 3:56 PM

    Please just copy and paste this code:

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

    I took that from the code you provided above. It is clean iframe code without script code.

    Do let us know how that worked for you.

    Thank you!

  • restrenauto
    Replied on January 15, 2017 at 7:02 PM

    buenas noches:

     

    realmente sigue el mismo problema después de copiar el código que me dejaron. es como si el formulario no tuviera fin. 

     

    agradezco que me ayuden a solucionar para saber que estoy haciendo mal

     

  • candy
    Replied on January 16, 2017 at 1:37 AM

    Hello,

    In my opinion, the issue could be different than embedding way. 

    Firstly, I think the container of the form in your website could be too narrow to embed the form. You should check its CSS codes and please set it wider.

    Also, it seems that you might have disabled the scrolling in the form container. Please check it and add related CSS codes.

    Moreover, you might have an additional, unnecessary container in the HTML codes which causes an error on the website.

    I have seen that your form is in the local now. When publishing it, please give us its URL in order to assist you better.

    Please try and if the issue still persists, let us know.

    Thanks in advance.