detecting when the "File download" popup is closed

Question

I have a web page (made with JSF) where some links allow the user to get a PDF file.

When the user clicks on such a link, a waiting popup (it is a modal panel) is displayed (because the generation of the PDF can be long), and once the file is created, IE displays the "File download" popup that proposes "Open", "Save" and "Cancel" options.

Is there a way in Javascript to know from my web page when this popup is closed, i.e. when the user has saved (or opened) the PDF file?

To be a little more precise, in the web page that displays the link to the PDF file, a modal popup is displayed (the "waiting popup") in order to make the user waits for the "File download" popup. The problem is that when the user Saves (or open) the PDF file, the "File download" popup closes, but the user then "returns" to the original webpage, with the waiting popup still displayed.

Note that my application runs only in IE6, so I am not against a IE(6)-only solution...

I have also no problem with solutions that need jQuery ;)

Edit: If a solution exists to catch any event that is fired exactly when the "File download" popup is displayed to the user (i.e. before the user chooses to Save, Open or Cancel), it will be fine for me too!

Solution 1

I had to work on this kind of issue, on another project. I finally found a smart solution, as explained in another Stackoverflow question.

The explanation is given in the following post: http://gruffcode.com/2010/10/28/detecting-the-file-download-dialog-in-the-browser

The idea is to "simply" use a cookie to define when the file is downloaded.

Solution 2

No such event exists. You need to take a different approach to solve this.

1. target the download link to a hidden iframe with a name (target="myhiddeniframe")
2. on click of the download link, show your loading spinner
3. set the onload attribute of the iframe to a callback that hides your spinner

Net effect: you "spin" while the pdf is generated, and "unspin" when the "File download" dialog appears (as opposed to when the "File download" dialog is closed).

Solution 3

• open your waiting popup
• do an AJAX query to generate the file, which returns the URL to that file
• in the AJAX query callback, close your waiting popup then redirect to the file URL

Example:

$('.generate_file_asynchronously').click(function(){
    var url = $(this).attr('href');

    show_loading_message();

    $.get(url, function(file_url) {
        hide_loading_message();
        window.location.href = file_url;
    });

    return false;
});

Solution 4

I am very sure that the answer is no, unless you want to consider some sort of ActiveX plugin to the browser (in which case the answer might still be no...)

View more solutions

Comments

[alanquillin]

Exactly what I was looking for. I already had the modal dialog with the iframe, but I was trying to bind an event to the document load of the loading page in the iframe... this did not work. You solution works. Thanks!

[bluish]

It sounded ok, but in my case iframe load event is not triggered, probably because it triggers only if content is HTML.

[Crescent Fresh]

@bluish: plain ol <iframe onload=... > works. Alternatively: myiframe.onload=.... Using a lib to attach events (say, via addEventListener('load')) does not work IIRC.

[refik]

Sadly, iframe doesn't fire any event upon file download.

[Sead Lab]

You save my life!