populate a field in an iframe with query string

[g3t]

Is it possible to target a text field that is in a iframe.

Here is my code so far. Just cant seem to target the field inside the iframe.

thanks in advance any suggestions.

function getqueryString(){ 
 
var url=location.href; 
 
if(url.split('?email=')[1]!=undefined) { 
 var qs=url.split('?email=')[1]; 
 
String.prototype.splitqueryString=function() { 
 return this.split(/[=+&]/); 
 } 
 

top.frames["ifrm"].document.getElementById('EMAIL_FIELD').value=qs.splitqueryString();;

 } 
 } 
 window.addEventListener?email= 
 window.addEventListener('load',getqueryString,false): 
 window.attachEvent('onload',getqueryString); 
</script>

[jscheuer1]

Messy. And I should first say that both pages must be on the same domain. If you even have one with www. in its location/src and the other without the www. part, it will not work. So best to use the relative path for the src attribute/location for the iframe. The query string is location.search, so a way to get it is:

function getQval(n) {
	if(typeof n !== 'string'){
		return null;
	}
	var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search;
	return (m = r.exec(m))? unescape(m[1]) : null;
}

That will get you a named value from it if it exists. So if you have a URL like:

http://www.somedomain.com/somepage.htm?iframefield=How+are+you%3F

and do:

var iframefield = getQval('iframefield');
if(iframefield){
	function populatefield(val){
		val = val.replace(/+/g, ' ');
		top.frames["ifrm"].document.getElementById('EMAIL_FIELD').value=val;
	}
	if (window.addEventListener){
		window.addEventListener('load', function(){populatefield(iframefield);}, false);
	}
	else if (window.attachEvent){
		window.attachEvent('onload', function(){populatefield(iframefield);});
	}
}

That might do it. But is the top.frames["ifrm"] frame loaded? It might be, it might not.

You would be better off putting this code before the closing </body> tag on the top page:

<script type="text/javascript">
function getQval(n) {
	if(typeof n !== 'string'){
		return null;
	}
	var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search;
	return (m = r.exec(m))? unescape(m[1]) : null;
}

var iframefield = getQval('iframefield');
if(iframefield){
	function populatefield(val){
		val = val.replace(/\+/g, ' ');
		top.frames["ifrm"].document.getElementById('EMAIL_FIELD').value=val;
	}
	if (window.addEventListener){
		document.getElementsByName('ifrm')[0].addEventListener('load', function(){populatefield(iframefield);}, false);
	}
	else if (window.attachEvent){
		document.getElementsByName('ifrm')[0].addEventListener('load', function(){populatefield(iframefield);}, false);
	}
}
</script>

Still no guarantee, but the chances are better, most likely will work, assuming I've made no typos and the name of the iframe is correct and unique. Only problem is that the iframe might have already loaded before we get to this code. So we could do:

<script type="text/javascript">
function getQval(n) {
	if(typeof n !== 'string'){
		return null;
	}
	var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search;
	return (m = r.exec(m))? unescape(m[1]) : null;
}

var iframefield = getQval('iframefield');
if(iframefield){
	function populatefield(val){
		val = val.replace(/\+/g, ' ');
		try{top.frames["ifrm"].document.getElementById('EMAIL_FIELD').value = val;}
		catch(e){}
	}
	populatefield(iframefield);
	if (window.addEventListener){
		document.getElementsByName('ifrm')[0].addEventListener('load', function(){populatefield(iframefield);}, false);
	}
	else if (window.attachEvent){
		document.getElementsByName('ifrm')[0].addEventListener('load', function(){populatefield(iframefield);}, false);
	}
}
</script>

Just in case. But try/catch is not guaranteed to recover from all errors, especially ones involving multiple frames, so -

Still better would be to handle this from the page in the iframe:

<script type="text/javascript">
function getTopQval(n) {
	if(typeof n !== 'string'){
		return null;
	}
	var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = top.location.search;
	return (m = r.exec(m))? unescape(m[1]) : null;
}

var iframefield = getTopQval('iframefield');
if(iframefield){
	function populatefield(val){
		val = val.replace(/\+/g, ' ');
		document.getElementById('EMAIL_FIELD').value = val;
	}
	populatefield(iframefield);
	if (window.addEventListener){
		window.addEventListener('load', function(){populatefield(iframefield);}, false);
	}
	else if (window.attachEvent){
		window.addEventListener('load', function(){populatefield(iframefield);}, false);
	}
}
</script>

That code can go in the head of the page in the iframe.

[Beverleyh]

I haven't tried but it looks like you can do it with jQuery's contents() method http://api.jquery.com/contents/

A tutorial http://www.tutorialspoint.com/jquery...l-contents.htm - you can find more if you search.

Note, you can only do this if the Iframed page is on the same domain.