I am posting some data to the server using jquery ajax. The server spews out a file (if the request is successful). I am just wondering how to initiate the save file dialog within the success callback given the results? Thanks.
PS:
The simplest solution is:
$('#ExportToExcel').click(function () {
$('#form').attr({ action: 'bla' });
$('#form').submit();
return false;
});
It is possible to ask the browser to offer the Save File dialog in your situation, yes, with a combination of JavaScript, the server response, and the handling of that response by the browser.
Here's how:
POST the data to the server.iframe with a unique name.target to be the name of the iframe.formElement.submit()).Content-Disposition header with the value attachment. This is a suggestion to the browser that the result should be saved rather than displayed in the browser itself.If you want to get really fancy, you can use the cookie trick I describe in this other answer so you can get notification when the response is received (whether the server responds with the requested data, or an error). I use that very successfully in a browser-based DHML+JavaScript application where the user can request a custom PDF, and choose to either view it in a browser window (in which case I have the server include the Content-Disposition: inline header) or save it as a file (Content-Disposition: attachment).
$.ajax at all, that's what I meant with steps 1-4 above. You literally fill in fields in a form (they can be hidden fields if you like) and use the submit method of the form's DOM element to do it. This doesn't tear down your page the way a form submit usually would, because the form has a target. You use the cookie trick to know when the response has been received. The user experience is largely the same as your $.ajax solution, it's just how you make it happen that's different.You can't open a save file dialog with pure JavaScript.
EDIT: it seems you can. See T.J. Crowder's answer.
Original answer is still valid:
You could use Flash, or simply redirect to the download page using JavaScript.
For example:
$.post('/some/url', function(data) {
// lets for the moment, assume that you
// return a JSON string containing some
// parameters, data.url being the URL of
// your download file
var downloadUrl = data.url;
window.location.href = downloadUrl;
});
It is not possible to download the file that is being returned directly by your AJAX-request. Instead, save the file on the server - perhaps in a temporary file - and return a URL that downloads the file and removes it from the server afterwards.
