Why my embedded form is cut off?

  • Profile Image
    restrenauto
    Asked on January 14, 2017 at 07:09 PM

    Hello

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

     

     

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

  • Profile Image
    Jan
    Answered 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: 

    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.

  • Profile Image
    restrenauto
    Answered on January 15, 2017 at 10:39 AM

    buenos dias:

     

    este es el codigo Iframe:

     

    <iframe id="JotFormIFrame-70104846408655" onload="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.

  • Profile Image
    Nik_C
    Answered on January 15, 2017 at 03:56 PM

    Please just copy and paste this code:

    <iframe id="JotFormIFrame-70104846408655" onload="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!

  • Profile Image
    restrenauto
    Answered on January 15, 2017 at 07: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

     

  • Profile Image
    candy
    Answered on January 16, 2017 at 01: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.