Hi all,
I normally avoid iframes and wish I was right now!..., could someone explain to me what is going wrong with this code (I've made this just to recreate the error).
In the main page I have,
In test1.html
and finally test2.html
......................................
I can click either of the those buttons when the page loads and it will populate the iframe with the right page (test1.html or test2.html), then I can click the "test me" button and I'll receive the alert, but once I try clicking it for the second time I get an error in FF console stating "window.frames.theFrame.calltest is not a function" even though it's on both pages.
Does anyone have any ideas what is going wrong here ?.
Thanks!
I normally avoid iframes and wish I was right now!..., could someone explain to me what is going wrong with this code (I've made this just to recreate the error).
In the main page I have,
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
//<![CDATA[
function testcall(){
window.frames["theFrame"].calltest();
document.getElementById('testbtn').style.display = 'none';
}
function populate(num){
document.getElementById('testbtn').style.display = 'inline';
document.getElementById('iHolder').innerHTML = '<iframe src="test'+num+'.html" id="theFrame" name="theFrame"><\/iframe>'
}
//]]>
</script>
<div id="example">
<div id="iHolder">
</div>
<form>
<input type="button" id="testbtn" value="Test Me" onclick="testcall();" style="display:none;" />
</form>
</div>
<form>
<input type="button" onclick="populate('1');" value="Set 1" />
<input type="button" onclick="populate('2');" value="Set 2" />
</form>
</body>
</html>In test1.html
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<script type="text/javascript">
function calltest(){
alert('I was called 1 ?');
}
</script>
<title></title>
</head>
<body>
</body>
</html>and finally test2.html
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<script type="text/javascript">
function calltest(){
alert('I was called 2 ?');
}
</script>
<title></title>
</head>
<body>
</body>
</html>I can click either of the those buttons when the page loads and it will populate the iframe with the right page (test1.html or test2.html), then I can click the "test me" button and I'll receive the alert, but once I try clicking it for the second time I get an error in FF console stating "window.frames.theFrame.calltest is not a function" even though it's on both pages.
Does anyone have any ideas what is going wrong here ?.
Thanks!