After iframe is loaded callback function doesn't run

Question

My problem is very similar to this one: Downloading large files with jQuery & iFrame - Need a File Ready event so I can hide the loading gif I need to download an excel report and while it is generating I want to show some gif that generating is in progress. After report is downloaded I want to hide this gif animation. That's what I wrote:

//...
    } else if(dest == "xls") {
        Main.pm.showLoadingMessage(); //Show progress gif
        var iframeId = "currentReportIframe";
        $("#" + iframeId).remove();

        var iframe = $("<iframe/>").attr({
            id: iframeId,
            src: "./services/ReportsResource/getCurrentViewReport?" + common,
            style: "visibility:hidden;display:none"
        });


        iframe.load(function() {
            Main.pm.hideLoadingMessage(); //Hide progress gif
        });

        $('body').append(iframe);

        return false;
    }
//...

Unfortunately this solution doesn't work in Google Chrome(at least v. 44), but works fine in Firefox.

I also tried solution from the question above. However, it hides my progress bar immediately, so I even don't see it on the screen.

Any ideas how I can solve my problem?

UPD: @a-wolff, Thank you for your comments. When I put onload callback before set src browser even doesn't send a request. That's what I tried:

        Main.pm.showLoadingMessage(); 
        var iframeId = "currentReportIframe";
        $("#" + iframeId).remove();

        var iframe = $("<iframe/>").attr({
            id: iframeId,
            style: "display:none"
        });

        $("#" + iframeId).load(function() {
            Main.pm.hideLoadingMessage();
        });

        $("#" + iframeId).attr('src', './services/ReportsResource/getCurrentViewReport?' + common);

        $('body').append(iframe);

@epoch In my case callback function fires once, but probably it doesn't fires the second time because of some kind of WARNING message which I receive in Chrome Console:

Resource interpreted as Document but transferred with MIME type application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

Since I download an excel spreadsheet(*.xlsx) I set a appropriate MIME type on server side.

Maybe completly unrelevant to your issue but have you tried to set iframe `onload` event before setting its attribute `src`? It could be an issue if iframe url is cached. BTW, you should just use: `style: "display:none"` — A. Wolff, Jul 29 '15 at 07:27

score 0 · Answer 1 · edited May 23 '17 at 12:21

0

Try to use a counter inside the load event (according to an answer to this question jQuery iframe load() event? ) the iframe load event maybe fired 2 times, ono on the empty iframe and one on load finish

fire = 0;
iframe.load(function() {
    if(fire==1)
    Main.pm.hideLoadingMessage(); //Hide progress gif
    fire++;
});

edited May 23 '17 at 12:21

Community

1
1

answered Jul 29 '15 at 07:37

Vanojx1

5,574
2
23
37

After iframe is loaded callback function doesn't run

1 Answers1