Simple reference of object inside iframe - HOW!

I simply need to reference an object inside an iframe:

I need it to work on all browsers as I understand this is difficult for this type of command.

Why does the below code not work in ANY browser let alone all of them.

I have tested in IE8 and FF3 (not IE7).

file1.html

<iframe name=“iframe1” id=“iframe1” src=“file2.html”></iframe>
<script>
parent.iframe1.form1.obj1.disabled=false;
</script>

file2.html

<form action=“” name=“form1” id=“form1” method=“POST”>
<input type=“button” name=“obj1” id=“obj1” disabled=true value=“BUTTON” />
</form>

Perhaps the following information about iframes will help.
http://www.jr.pl/www.quirksmode.org/js/iframe.html

No, this doesn’t do it (thanks anyway).

The document talks about changing the file inside the iframe. I want to change an object inside the iframe.

The code below will change the file, but I can’t expand on it:
parent.document.getElementById(‘iframe1’).src = “newpage.html”;

I have tried:
parent.document.getElementById(‘iframe1’).document.form.object.value
parent.document.getElementById(‘iframe1’).form.object.value
parent.document.getElementById(‘iframe1’).getElementById(‘object’).value
…but none work

Is the iframe on a different domain, or a sub-domain from the main page?

No, same domain / folder everything

If you’re in the parent window, then you don’t need to use the parent object. You are the top of the heiarchy already.


document.getElementById('iframe1').document.getElementById('object').value

should work fine. Of course, the iframe must finish loading before you can access its contents. window.onload would be an easy way to ensure that.

Also, the src must be of the same domain.

Another possibility is to pass the new swf as a querystring pararmeter to the iframe, and have the page within the iframe retrieve it from the querystring.

I have tried all your advice.

http://www.page-test.co.uk/test1.html
http://www.page-test.co.uk/test2.html

A demo is here, you can see the source. It just doesn’t change.

Use the frames reference instead.


window.frames['iframe1'].document.getElementById('obj1').innerHTML = 'YES, changed';

I have worked it out:

go back to the script I first posted
parent.iframe1.form1.obj1.disabled=false;

and change to

parent.iframe1.contentWindow.form1.obj1.disabled=false;

“contentWindow.” was the missing bit.

I have updated my test1.html / test2.html pages and it works.

Thanks for all your help.

document.getElementById('iframe1')[B].contentWindow[/B].document.getElementById('object').value = 'Changed';