Webpage not resizing to reflect form size

Hi,

Not sure if this is a Jotform or a Wordpress issue, but when I embed the form into the webpage the page doesn't expand to reflect the size of the form?

Does anyone else have this issue? Any thoughts?

Thanks

The problem is that the form's height is set to 514px in the embed code:

<iframe id="JotFormIFrame" style="width: 100%; height: 514px; border: none;" src="https://secure.jotform.co/form/52728087119865?post=14941&amp;action=edit" height="240" width="320" frameborder="0" scrolling="no"></iframe>

Please try changing the height to be 1870px, which is how tall the form really is at the moment:

<iframe id="JotFormIFrame" style="width: 100%; height: 1870px; border: none;" src="https://secure.jotform.co/form/52728087119865?post=14941&amp;action=edit" height="240" width="320" frameborder="0" scrolling="no"></iframe>

Additionally, I can see that the script that is added just under the iframe is also broken, most likely by some plugin in Wordpress that modified the text/code which you have pasted. The script under the form at the moment looks like this:

<script type="text/javascript">// <![CDATA[
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("contentWindow" in iframe &#038;&#038; "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 &#038;&#038; window.location.href.indexOf("?") > -1) { var ifr = document.getElementById("JotFormIFrame"); var get = window.location.href.substr(window.location.href.indexOf("?") + 1); if(ifr &#038;&#038; get.length > 0) { var src = ifr.src; src = src.indexOf("?") > -1 ? src + "&#038;" + get : src + "?" + get; ifr.src = src; } }
// ]]&gt;</script>

This shows that the Wordpress site has replaced & characters with their encoded counterpart - &#038; which is effectively breaking that part of the script. Your script under the form should instead look like this:

<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("contentWindow" in iframe &#038;&#038; "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 hope this helps. Please let us know if changing the height of the iFrame from 514 pixels to 1870 pixels resolved the issue of the form being cut off, or if the issue persists. Thank you.

Thanks for the followup, that solved all my issues. Website was striping my code and this is looking much better. Thanks again

On behalf of my colleague, Boris, you are welcome. If you have any other question or concern, please feel free to contact us again and we will be happy to assist you.