Dean.DePue Dean.DePue - 3 months ago 7
jQuery Question

Disable page on Javascript submit (during file download)

I've looked and don't see any way to disable the page, like an overlay on the page to prevent any action when I have a JavaScript submit action:

function AgendaMinutes() {
var id = '@Model.ID';
var form = $('<form method="POST" action="AgendaMinutes">');
form.append($('<input type="hidden" name="dprid" value="' + id + '">'));
$(body).append(form);
form.submit().remove();
return false;
}


This works like a charm in generating and sending a PDF to the client, but allows the user to click the button more than once. I could disable the button but how do I know when the PDF has been returned so that I can release it?

Answer

but how do I know when the PDF has been returned [so that I can re-enable the page]

The simplest option for downloading a file and "knowing" when it is complete is to send the file to a new window/tab via target="_blank".

This way, the user gets a progress indicator (via the browser) and your page doesn't need to know when it's completed (as the other tab handles it) so can be be re-enabled immediately.

If your page needs to wait for some reason, eg the document must be generated before continuing, then an alternative solution would be require: in this case, I'd generate and persist the file on the server, then provide a download link to the client.

Comments