Content below javascript iframe disappears

I need to embed a jotform on my website in a iframe using javascript, reason being is because I've put cookies on my site to attribute UTM parameters when someone fills out a form.

After a few hours I finally got this working - the only problem is that when I use this code everything below it disappears on the front-end. Btw I'm using Divi theme builder with wordpress.

Here's the code, at the start is the cookies and then it's the iframe embed using javascript enter code here - Let me know if you have any ideas, cheers!:

 <script type="text/javascript">

var utm_source = Cookies.get('utm_source’) || "";

var utm_medium = Cookies.get(‘utm_medium’) || "";

var utm_content = Cookies.get('utm_content’) || "";

var utm_campaign = Cookies.get(‘utm_campaign’) || "";

var agent_id = Cookies.get('agent_id’) || "";

var email = Cookies.get(‘email’) || "";

var first_name = Cookies.get(‘first-name’) || "";

var last_name = Cookies.get(‘last-name’) || "";

var cookie_params = "?";

cookie_params = cookie_params + "utm_source=" + utm_source;

cookie_params = cookie_params + "&utm_medium=" + utm_medium;

cookie_params = cookie_params + "&utm_content=" + utm_content;

cookie_params = cookie_params + "&utm_campaign=" + utm_campaign;

cookie_params = cookie_params + "&agent_id=" + agent_id;

cookie_params = cookie_params + "&email_address=" + email_address;

cookie_params = cookie_params + "&nameffirst]=" + first_name;

cookie_params = cookie_params + "&nameflast]=" + last_name;

var new_jot_src = "https://form.jotform.com/201827949762266" +

cookie_params; }

</script>;

<iframe id="JotFormIFrame-FORM ID"

title="FORM TITLElscreen="true” allow="geolocation; microphone; camera” src=https://form.jotform.com/FORM ID?utm_source=null&utm_medium=null&utm_content=null&utm_campaign=null&agent_id=null&email=null&name[first]=null&name[last]=null"

+ new_jot_src + " frameborder="0" style=" min-width: 100%; height:627px; border:none;”

scrolling="no"><\/iframe>');

document.write('<script type="text/javascript"> var ifr =

document.getElementByld("JotFormlFrame-FORM ID"); if(window.location.href &&

window.location.href.indexOf("?") > -1) { 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; } }

window.handleIFrameMessage = function(e) { if (typeof e.data === "object") { return; } var args

= e.data.split(":"); if (args.length > 2) { iframe = document.getElementByld("JotFormiFrame-" +

args[(args.length - 1)]); } else { iframe = document.getElementByld("JotFormlFrame"); } 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; case "loadScript": var src = args[1]; if

(args.length > 3) { src = args[1] + ":” + args[2]; } var script = document.createElement("script");

script.src = src; script.type = "text/javascript"; document.body.appendChild(script); break; case

“exitFullscreen”: if (window.document.exitFullscreen) window.document.exitFullscreen(); else if

(window.document.mozCancelFullScreen) window.document.mozCancelFullScreen(); else if

(window.document.mozCancelFullscreen) window.document.mozCancelFullScreen(); else if

(window.document.webkitExitFullscreen) window.document.webkitExitFullscreen(); else if

(window.document.msExitFullscreen) window.document.msExitFullscreen(); break; } var

isJotForm = (e.origin.indexOf("jotform") > -1) ? true : false; iff(isJotForm && "contentWindow" in

iframe && “postMessage" in iframe.contentWindow) { var urls =

{"docurl":encodeURIComponent(document.URL),"referrer":encodeURIComponent(document.ref

errer)}; iframe.contentWindow.postMessage(JSON.stringify({"type”:"urls”,"value":urls}), "*"); } }; if

(window.addEventListener) { window.addEventListener("“message”, handlelFrameMessage,

false); } else if (window.attachEvent) { window.attachEvent("onmessage",

handleIFrameMessage); } <\/script>');

</script>

Greetings,

Kindly share with us more information about the issue, is it the form that is not showing when embedded? or the variables not passing to your iFrame's URL parameter?

We will wait for your response.