Ajax file upload

Question

I have a form that upload a file, I would process the file inline with ajax but I don't know how I can get the data with ajax.

In my script I use this method:

 $.ajax(
            {
                type:    "POST",
                url:     "upload.php",
                data:    ({ file : '???' }),
                success: function(msg)
                {
                    $('#upload_box').html(msg);
                }
            });

How I can declare the 'file' var fetching the file data? (filename, tmp_name, type, size, etc).

Answer 1

You can't do this with a standard AJAX request. The most common workaround is to post the file to a hidden iFrame as seen in this tutorial.

Since you are using jQuery, you may find the AJAX Upload library useful.