19

I am having a problem with onLoad event of an iframe on Google Chrome. I created an iframe and set value for its "src" attribute to get a file from server. While server is processing, a waiting box is displayed until client gets the returned file. I tried to use the onLoad event of iframe to detect when client get the file to turn off that waiting box, but on Google Chrome that event handler does not work.
With Firefox, when client gets a file, a "Save to" popup will be displayed automatically and event "load" will be fired, but this is not happen on Chrome.
Could you please tell me how to handle this issue? Thank you so much!

Đinh Hồng Châu
  • 5,300
  • 15
  • 53
  • 90

3 Answers3

16

I've run into this exact issue. It turns out Chrome triggers absolutely no events in an iframe upon a file download.

Since there are no events to look out for and you're returning a file (as apposed to any inline content) the workaround I was forced to inspect the contents of the iframe after a few seconds, if it is empty then assume there were no errors and the results were processed correctly. If it contains data (my server will return JSON if there are any errors) then handle the error data accordingly.

josliber
  • 43,891
  • 12
  • 98
  • 133
Dan
  • 3,389
  • 5
  • 34
  • 44
  • I guess that's what the plugin does from this answer http://stackoverflow.com/a/20973242/1175496 – Nate Anderson Feb 20 '15 at 19:38
  • Please refer to the following post for a sample code: https://stackoverflow.com/questions/12076494/onload-in-iframes-not-working-if-iframe-have-non-html-document-in-src-pdf-or-t/12190776#12190776. It took me a bit of time to figure out that a number of other answers elsewhere, which refer to the use of the `onload` event, where actually false. It's possibly something to do with the latest web browsers being more aligned with the specification. – RZet Oct 20 '17 at 09:50
6

I've run into this same problem and I ended up using this plugin: http://johnculviner.com/jquery-file-download-plugin-for-ajax-like-feature-rich-file-downloads/

It's based on the same concept morgan describes, it's easy to use and and it worked great.

Andrea
  • 1,838
  • 1
  • 13
  • 7
1

The way I got around this issue was to set a cookie (done = 0) when the page that is going to have the iframe loads, I use javascript to drop the iframe onto the page and I change the value of this cookie when the iframe's source script runs successfully (done = 1).

I then used a simple ajax call with a settimeout to return the value of the cookie, when the value is 1 I can trigger the onload event (that works for all other browsers).

morgan
  • 11
  • 1
  • 1
    Just stepped over doing reviews. Did you see this [post on stackoverflow](http://stackoverflow.com/questions/1106377/detect-when-browser-receives-file-download) ? – Raul Pinto Oct 11 '12 at 08:34