Click to See Complete Forum and Search --> : correct use of iframe onload for targetting
jovialjonny
09-09-2003, 11:56 AM
Hi,
I have a page containing a form. When the user clicks to submit the form I open a child page- in this I create an iframe and then I set the parent page to target that iframe.
The problem is if that the iframe is not being created in time and so the parent page cannot target it.
What I want to do is set an onload event of the iframe which will let the parent window know that it is loaded and can now be targetted. I have tried to do this like so:
var ifrm = document.createElement("IFRAME");
ifrm.name = "frameOne";
ifrm.onload = callOpener;
document.body.appendChild(ifrm);
However this onload event never fires, can someone tell me am I using the correct syntax or if there is another way around this problem?
Khalid Ali
09-09-2003, 12:23 PM
iframe does not have an onload event attribute...you will need to use either an inline onload event in the body tag of the src page that opens in the iframe or you may want to try
parent.framName.window.onload.....( am not sure if its valid nor I tested it)
use this instead:
ifrm.onreadystatechange = callOpener;
you will need to check ifrm.readyState though, should be "complete" followed by "interactive".
jovialjonny
09-09-2003, 01:59 PM
Thanks for the suggestions but I have taken a slightly different approach...
I have hard-coded the iframe into the child page's HTML, then I am setting the onload of the child page's body to the "callOpener()" method.
The thing is I may need to create multiple iframes dynamically so I also call another function which builds the next frame that will be required so in effect there is always one spare iframe on the page. Thus if the user clicks submit on the form again it is targetted to this spare frame and another spare frame gets built.
This has lead me to a really strange problem--the targetting for the hard-coded frame operates correctly, however the opener page containing the form will NOT target the dynamically generated frame on the 2nd time around and instead opens in a new window.
I have checked (via alerts) in both the child and the parent that the iframe exists, that they both can reference it and that the form is targetted to the correct frame name but it just wont work.
What's strange is if I substitute in a hard-coded HTML version of the same iframe it targets correctly but I don't want to do this because users should be able to add as many frames as they wish, not up to some hard-coded limit.
This might be a bit confusing to read so here's the HTML:
CHILD PAGE:
<body onload="callOpener();buildNextFrame()">
<iframe name="f1" class="hiddenFrame" frameborder="0" scrolling="Auto"></iframe>
</body>
//This builds the next frame to be targetted
function buildNextFrame()
{ //getNewestName() generates unique frame names.
var newName = getNewestName();
var ifrm = document.createElement("IFRAME");
ifrm.name = "f"+ newId;
ifrm.className = "hiddenFrame";
ifrm.scrolling = "Auto";
ifrm.frameBorder = 0;
document.body.appendChild(ifrm);
}
If I drop the dynamic creation and hard-code the 2nd frame like so, the targetting works correctly:
<body onload="callOpener();buildNextFrame()">
<iframe name="f1" class="hiddenFrame" frameborder="0" scrolling="Auto"></iframe>
<iframe name="f2" class="hiddenFrame" frameborder="0" scrolling="Auto"></iframe>
</body>
I can see absolutely no difference between the HTML and the element I create in JavaScript so I don't understand why this won't work, has anyone else encountered problems in targetting a dynamically generated frame in this way?
some findings:
if you compare the ifrm and the newly created window.frames[n], it gives you false though they should point to the same frame object.
and if you check window.frames[n].name, it's blank, not set by the following line:
ifrm.name = "f"+ newId; // typo of newName?
but if you set the window.frames[n].name after the appendChild() line:
window.frames[window.frames.length-1].name=ifrm.name;
you should be able to target it via name.
however, if you use ifrm.src="" to load some page into that frame, then window.frames[n].name would be reset to blank and won't be targetted by name, you will need to set it again.
jovialjonny
09-09-2003, 04:04 PM
>ifrm.name = "f"+ newId; // typo of newName?
That was just a typo on my part sorry!
I just saw the same issues you mentioned with the name not appearing in the window.frames collection.
By putting the line "window.frames[window.frames.length-1].name=ifrm.name;" after appendChild like you suggested everything is working properly now so thanks for that.
Very interesting problem, I dont really understand why the name isn't just being set by 'ifrm.name' but its working now so I'm happy!:D
Khalid Ali
09-09-2003, 04:10 PM
Originally posted by Xin
use this instead:
ifrm.onreadystatechange = callOpener;
You should have mentioned that your solution is only IE specific,otherwise its misleading suggestion. This is why I say this..:D
Originally posted by Xin
use this instead:
my bad, it looked to me some IE stuffs when i saw iframe, that's some side-effect i got from version 4 time.