Form not displaying correctly

  • Profile Image
    intagliocreative
    Asked 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!!

  • Profile Image
    Charlie
    Answered 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
    intagliocreative
    Answered 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
    Kevin_G
    Answered 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.