-
greaterkatypanhellenicAsked on January 29, 2016 at 2:08 PM
-
MikeReplied on January 29, 2016 at 2:12 PM
Do you mean that form is not showing the whole Thank You page upon submission from the following page?
http://katypanhellenic.org/registration.html
Can we submit a test entry to check this out?
-
greaterkatypanhellenicReplied on January 29, 2016 at 2:16 PM
Sure, you can send a test entry. I tested 2. and only quarter of a page showed up. See attached photo. Thats the link on the thank you page, but the thank you page itself is also like that. You'll notice there is a scroll bar at the side, it can be scrolled and everything is there. it seems like the height became limited. I'm not sure if I accidentally changed it, but I don't remember editing that portion of the thank you page. THANK YOU!~
-
Kevin Support Team LeadReplied on January 29, 2016 at 11:44 PM
I was able to replicate your issue, I checked the code and there is a Javascript code that is changing the height of your form and this is why it's being displayed like this.
I would suggest you to use the iFrame method: http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code.
It should fix the issue, but please, update us and let us know how it works with the iFrame code.
-
greaterkatypanhellenicReplied on February 1, 2016 at 2:59 PM
I updated the code to the iframe but it's still giving the same output.
-
Kevin Support Team LeadReplied on February 1, 2016 at 5:02 PM
Yes, I checked your website and I can see that the issue is still there, I copied the iFrame code and pasted it in a locally file and the issue was there, however, I just made some updates on the code provided by the wizard and it's now working, please use this iFrame code:
<iframe
id="JotFormIFrame"
onDISABLEDload="window.parent.scrollTo(0,0)"
allowtransparency="true"
src="https://form.jotform.com/60246169865161"
frameborder="0"
style="width:100%;
height:525px;
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":
tempHeight=0;
if(args[1]==367){
tempHeight=450;
}else{
tempHeight=args[1];
}
console.log("Temporary height: " +tempHeight);
iframe.style.height = tempHeight + "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>
This should show you all the height for your current thank you page.
Other way to solve it, would be setting the height manually, and avoid using the Javascript code, that calculates dynamically the height for your form.
If you would decide to do it, you just would need to use this code:
<iframe
id="JotFormIFrame"
onDISABLEDload="window.parent.scrollTo(0,0)"
allowtransparency="true"
src="https://form.jotform.com/60246169865161"
frameborder="0"
style="width:100%;
height:2676px;
border:none;"
scrolling="no">
</iframe>
It has a fixed height and will be the same for your form as well as for the thank you page.
Hope this helps.