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

    Form not displaying correctly

    Asked by intagliocreative on April 20, 2016 at 10:59 AM

    Hello!

     

    My form is not displaying past the credit card fields when browsing in google chrome.

    If I switch to an iframe embed, nothing displays at all.

     

    https://www.lydiashouse.org/donate/

     

    Thank you!!

    Page URL:
    https://www.lydiashouse.org/donate/

    form not displaying displaying correctly credit card www hello
  • Profile Image
    JotForm Support

    Answered by Charlie on April 20, 2016 at 01:28 PM

    I see the problem, could you please try using the iFrame embed code again? After that, we will check if there are any code conflict or errors happening.

    You can also set a specific height on your iFrame so it won't cut.

    Here's a sample of your iFrame embed code:

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

     

    I also see that you are using a custom CSS code and positioning the form to float left? Have you tried removing that CSS code? See if that will give you a better result. 

    We'll wait for your response.

  • Profile Image

    Answered by intagliocreative on April 20, 2016 at 04:10 PM

    It was the custom CSS that was causing the break with the iframe. All is solved. Thank you!

  • Profile Image
    JotForm Support

    Answered by Kevin_G on April 20, 2016 at 06:41 PM

    On behalf of my colleague, you're welcome. 

    If you need further assistance, do let us know and we will be glad to help you.