473,395 Members | 1,783 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

Iframe IE onload problem

Look at the following code:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3.  
  4. </head>
  5. <body>
  6.  
  7. <iframe id="olaf" name="olaf" onload="alert('no');"></iframe><br>
  8. <input type="submit" onclick="document.getElementById('olaf').src = 'phpinfo.php'" value="Test">
  9.  
  10. </body>
  11.  
  12. <script language="javascript">
  13. var obj = document.getElementById('olaf');
  14. obj.onload = function() { alert('yes'); }
  15. </script>
  16.  
  17. </html>
The "obj.onload=" contruct should override the first onload statement. In Firefox it works fine and when I click the button a "yes" message is shown. But in Internet Explorer the "no" message is shown. My problem is that I need to set the function (anonmymous) that should be called by the brower when iframe.onload and I can't get this to workin in IE. Can anyone help?

Thanks!
/Niels
Jul 9 '06 #1
8 63819
I have the same problem with changing onload event of iframe in internet explorer. Instead of:

Expand|Select|Wrap|Line Numbers
  1. <iframe id="ifrm" onload="foo1();"></iframe>
and script:

Expand|Select|Wrap|Line Numbers
  1. getElementById("ifrm").onload = foo2
;

I used:

Expand|Select|Wrap|Line Numbers
  1. <span="ifrm_wrap"><iframe id="ifrm" onload="foo1();"></iframe></span>
and script:

Expand|Select|Wrap|Line Numbers
  1. getElementById("ifrm_wrap").innerHTML = '<iframe id="ifrm" onload="foo2();"></iframe>';
Not very nice, but works.
Feb 28 '07 #2
jianwu
1
I face the same problem. This looks like a stupid IE bug, I wasted hours of time struggling on this issue.

I noticed you can't get or set the onload event for iframe in I.E. When you get, you always get null even you put the onload attribute in the tag. When you set it, you can get what you set, seems it's ok. But the I.E will only call the one you specified in the IFRAME tag. Just ignore what you set. That's strange.

I finally find a walkaround. In the IFRAME tag, i hard code onload to call another function. Then I can set the value of another function.

Expand|Select|Wrap|Line Numbers
  1. <iframe style="display:none" id='f1' onload="this.onload_1();" />
  2.  
Expand|Select|Wrap|Line Numbers
  1. document.getElementById(f1).onload_1 = function(){alert('test');}
That works.
Dec 8 '07 #3
I know this is an old thread, but the first I encountered when searching for an answer, so I thought I'd chime in. To do it, you need to attach the event. I have event attachment wrapped in a function, but this should help:

Expand|Select|Wrap|Line Numbers
  1. eventPush(document.getElementById('frame_id'),'load',function () {myFrameOnloadFunction();});
  2.  
  3. function eventPush(obj, event, handler) {
  4.   if (obj.addEventListener) {
  5.     obj.addEventListener(event, handler, false);
  6.   } else if (obj.attachEvent) {
  7.     obj.attachEvent('on'+event, handler);
  8.   }
  9. }
  10.  
Oct 26 '08 #4
I was having this same problem. My code worked in every browser but IE. Here is my solution:

My original code was:

<iframe id="id" name="id" onload="function_name();" scrolling="auto" frameborder="1" src="example.asp"</iframe>
The working code is:

<iframe id="id" name="id" onload="return function_name();" scrolling="auto" frameborder="1" src="example.asp"</iframe>
I didn't think I was passing anything because my JavaScript doesn't have a return functionality to it but if it works..it works. This still work fine in Chrome and Firefox.
Aug 4 '09 #5
Thanks so much for all your help. I'm no expert in this "stuff" but my function calls to objects in an IFRAME did not work on IE, did everywhere else. Some of the techniques suggested here did not seem to work, others were a bit too complicated for me to follow.

A litte extra searching turned up this link:
http://www.dyn-web.com/tutorials/iframes/

And this interesting info:
(accessing IFRAME content)

// IE5.5+ windows
1) document.getElementById(iframeId).contentWindow
2) document.getElementById(iframeId).contentWindow.do cument
or,

// DOM
3) document.getElementById(iframeId).contentDocument

"3)" is what I began with, n/g in IE
"1)" also n/g
"2)" worked in IE, Firefox & Chrome

Go figure.
Jan 9 '10 #6
I came accross this thread when googling, I had the exact same problem. All the above solutions did not work for my case. I came up with a solution myself, which might be of help to others.

I used

window.onload = document.getElementById('frameid').setAttribute('o nload', 'whateverfunctionyouwant();');

as far as I can see this works for all browsers I tested on. Tested on Safari, Firefox, IE and Opera

In my case I had a dynamicly created iframe through javascript. I did this to have the onload events execute before the content of the iframe is fully loaded. The content of the iframe is from an external domain, so sometimes the content loads quite slow and I did not want my visitors to have to wait for that before they can acces the page.

This solution helps with a problem like in:

Expand|Select|Wrap|Line Numbers
  1. newFrame = document.createElement('iframe');
  2. newFrame.src = 'http://www.google.nl';
  3. newFrame.style.width = '600px';
  4. newFrame.style.height = '2500px';
  5. newFrame.setAttribute('onload', 'scroll(0,0)');
  6. document.getElementsByTagName('body')[0].appendChild(newFrame);
On the above example the page will return to the top of the document, whenever the iframe loads in a new document. When someone would have made a query through the iframe and hits next page, the document would automaticly go back to the top.

Hope this helps atleast someone.

Kind regards,

Wouter
Sep 8 '10 #7
I tried every solution posted above for my problem, and none of them worked. In my case, I have a form containing a file for upload whose target is pointed towards a static IFRAME element.

The FORM:
Expand|Select|Wrap|Line Numbers
  1. <form action="upload.php" method="post" enctype="multipart/form-data" target="myIframe">
The IFRAME:
Expand|Select|Wrap|Line Numbers
  1. <iframe name="myIframe" id="myIframe" src=""></iframe>
When the form submits, the file is handled by a PHP upload script. Now, in my case, I needed to have the contents of the uploaded file (an HTML page) output to the IFRAME window, like so:

Expand|Select|Wrap|Line Numbers
  1. <?php echo file_get_contents($_FILES['myFile']['tmp_name']); ?>
Additionally, I needed a callback to let my controlling script in the parent window know when the IFRAME's content has loaded. As you all know, this was easy enough in a Mozilla browser. In fact, I could communicate with the parent window using at least 5 different methods! However, not a single one worked for IE.

Then some of your suggestions got me thinking about this ONLOAD attribute for IFRAMEs. Even though none of the solutions worked, I did some research. Some people have said that even though the specification allows for the ONLOAD attribute in an IFRAME element, it just doesn't work (a bug in IE?!).

Finally, I stumbled upon this page:

http://msdn.microsoft.com/en-us/libr...s.85%29.aspx#4

This commenter shows his work using Microsoft's exclusive JScript coding. It was then that the solution was quickened to me! Here is his sample code:

Expand|Select|Wrap|Line Numbers
  1. <script for="window" event="onload" language="JScript">
  2.   window.status = "Page is loaded!";
  3. </script>
This effectively binds an ONLOAD event handler to the IFRAME element! But since the above snippet is ignored by FireFox, I simply write combined code to perform my cross-browser compatible callback.

My PHP upload script, then, looks like this:

Expand|Select|Wrap|Line Numbers
  1. <?php
  2. echo file_get_contents($_FILES['source-file']['tmp_name']);
  3.  
  4. <script language="javascript">
  5. // For Mozilla
  6. parent.window.myIframe.setAttribute('onload','myCallbackFunc();');
  7. </script>
  8.  
  9. <script for="window" event="onload" language="jscript">
  10. // For Microsoft
  11. parent.window.myCallbackFunc();
  12. </script>
  13. ?>
I hope this helps!
Feb 7 '11 #8
The problem can be Iframe loading before the script is executed. This can be prevented by adding the Iframe using Javascript.


Expand|Select|Wrap|Line Numbers
  1. var iframe = document.createElement("iframe");
  2. document.body.appendChild(iframe);
  3.  
Nov 6 '19 #9

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: saayan | last post by:
Hi, I have a php generated HTML page, which has a javascript call in the body tag: <body onunload="exitPage()" onload="setWidth()" onresize="setWidth()"> In certain cases, there can be an...
4
by: Thomas | last post by:
Hi there, I have an iframe which is editable (designMode = "on") and want to resize it dynamically as the content grows (e.g. more lines of text is in there) and there the struggle starts. I...
5
by: Grzesiek | last post by:
Hi! I have created page which contains some menu buttons and <iframe> with sub-page. Each menu action on the master web site should change content of iframe (by changing src attribute). But how to...
0
by: dimepiece18 | last post by:
On our Intranet homepage, I have a layer with an iframe contained in it. The iframe is linked to an html document that is stored in our Content Library system. You have to be authorized to view the...
1
by: Dave | last post by:
Usual apologies if this is old territory. I'm resizing a bunch of iframes on a page to the height of their contained documents. Some of the contained documents contain IMG tags. On IE this...
7
by: Tom Cole | last post by:
IFrames have been used by years for people to accomplish many of the tasks the XMLHttpRequest does for them now...I unfortunately am late in the game and XMLHttpRequest was already out there by the...
1
by: XP | last post by:
Hello Everyone, I was stuck with this really frustrating problem for sometime. Let me explain what I am trying to achieve: There is a form and an inner iframe. The form's target is set to the...
3
by: whatever0 | last post by:
Hi, I'm fairly new to javascript and was hoping i could have a little help... I have a page containing a form and an iframe. The iframe is initially empty (src="about:blank"). The target of...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.