Question

Possible Duplicate:
Downloading Via JQuery AJAX Post not working

filedownload.php has below snippent.

$file = 'cut.png';
header("Content-Type: image/png");
header('Content-Disposition: attachment; filename="'.$file.'"');
header("Content-Type: application/force-download");
header("Content-Type: application/octet-stream");
header("Content-Type: application/download");
readfile($file);
exit();

AJAX Call

jQuery.post('filedownload.php',{            
  'file'  :  result  // not used for the time being                    
 });

I make an ajax call to the filedownload.php file. It does not allow user to download the file. But If I run the php directly it allows user to download the file. What could be the issue ?

I would like to use core functions rather than using jQuery Plugins. If it’s not possible a plugin would be fine.

Given that I use ajax because the page can not be refreshed.

Answer 1

The Problem

Let’s take the example of a productivity web app such as a spreadsheet
editor, which has the ability to open, save, import and export. The
open and save options would involve loading a spreadsheet from the
database, whereas import and export deal with local files on the
user’s machine. To implement the export behavior, you might decide
that the user should have to save their spreadsheet first, allowing
you to export the data from the backend to file. But let’s assume
instead you’d like to allow users to export their data without saving,
perhaps to afford them the option of working locally without ever
storing data on the server. In order to do this, you’d need to send
the current spreadsheet data to the backend and receive a file to
download. Unfortunately, this can not be handled using Ajax, since
Ajax can only receive responses in the form of text. In cases where
the data to be saved is rather lengthy, this poses a considerable
problem.

The Workaround

In order to make the request, you’d need to make a regular (not Ajax)
HTTP request using GET or POST. If the data is reasonably short, you
might get away with a GET request (perhaps by simply setting
Window.location to your export url), but due to varying browser
limitations on GET request length, a POST will most likely be needed.
The following plugin allows you to make a request that returns a file
in a similar syntax to jQuery’s native Ajax functions.

jQuery Code Which fixes the problem

jQuery.download = function(url, data, method){
    //url and data options required
    if( url && data ){ 
        //data can be string of parameters or array/object
        data = typeof data == 'string' ? data : jQuery.param(data);
        //split params into form inputs
        var inputs = '';
        jQuery.each(data.split('&'), function(){ 
            var pair = this.split('=');
            inputs+='<input type="hidden" name="'+ pair[0] +'" value="'+ pair[1] +'" />'; 
        });
        //send request
        jQuery('<form action="'+ url +'" method="'+ (method||'post') +'">'+inputs+'</form>')
        .appendTo('body').submit().remove();
    };
};

How to call

$.download('filedownload.php','filename='+filename );

Read more