Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Capture incoming URL Parameters, then pass to iFrame Src with Javascript

So trying to figure out how to do this with window.location in Javascript. I'm sending users to our site with an appended URL with a Google Analytics code that I need to pass to an iframe src on that page. I'd assume Javascript could do this (note - I cannot use PHP)...

This is what I want to do:

I'd send users to the page with all the campaign data in tact. For example a user would click on this link: http://www.xyz.com/index.html?utm_source=Facebook&utm_campaign=Facebook+May&utm_medium=click

They would be directed to that page, that then has this iFrame on it. The code on the store side would need to pick up utm_source, utm_campaign, utm_medium and include these parts in the IFRAME SRC So this bit:

<iframe height="960px" frameborder="0" scrolling="no" width="958px" src="http://www.abc.com/minis"></iframe>

now becomes:

 <iframe height="960px" frameborder="0" scrolling="no" width="958px" src="http://www.abc.com/minis?utm_source=Facebook&utm_campaign=Facebook+May&utm_medium=click"></iframe>

Any javascript suggestions would be greatly appreciated. Note - I cannot use PHP.

UPDATE: Got this to work!! Yay, but now I need to edit it a bit:

So say the appended url that was clciked was this:

http://abc.com/index.html?apple&orange&peach

and I need the iframe src to be this

 http://xyz.com/minis?orange&peach

I moved a few things around in the script, but is now only grabbing orange and not the other & attribute (peach). please advise if there is a better way to work (without have all the params and then depending on what link comes in, some of the & will be undefined:

<body>

<script type="text/javascript">

$(function() {

var loc = window.location.toString(),
params = loc.split('&')[1],
params2 = loc.split('&')[2],
params3 = loc.split('&')[3],
params4 = loc.split('&')[4],
params5 = loc.split('&')[5],
params6 = loc.split('&')[6],
  iframe = document.getElementById('myIframe');
alert(iframe.src); 
iframe.src = iframe.src + '?' + params + '&' + params2 + '&' + params3 + '&' + params4+ '&' + params5;
alert(iframe.src); 

});
</script>
<iframe id="myIframe" src="http://www.xyz.com/minis"></iframe>

</body>
like image 411
jgrannis Avatar asked May 03 '12 16:05

jgrannis


2 Answers

This little snippet should do, here all you have to do is grab the bit after ? as a string and append it to the iframe source.

var loc = window.location.toString(),
    params = loc.split('?')[1],
    iframe = document.getElementById('myIframe');

iframe.src = iframe.src + '?' + params;​​​​​​​​​​​​​​​​
like image 50
GillesC Avatar answered Nov 06 '22 18:11

GillesC


Just use window.location.search.

const iframe = document.getElementById('frame');
iframe.src = iframe.src + window.location.search;​​​​​​​​​​​​​​​​
like image 1
Oleksandr Knyga Avatar answered Nov 06 '22 17:11

Oleksandr Knyga