AJAX uploading with PHP and Javascript

Question

Hey,

I want to dynamically send an upload form to CI via jQuery. The form needs to contain the file to be uploaded and the path to save to.

So far my AJAX-call looks like this:

file = $('#file').val();
path = active_dir;

upload_file( file, path );

function upload_file(file, path) {
  $.post("/upload_file/", { file: file, path: path }, function(data) {
    notice(data);
  });
}

The PHP-side of the script is tested and OK. And the path is processed as it should. But I get an error message from PHP that says that ‘No file was selected.’.

How should I fetch the file data from the form?

Thank you, Christoffer

Answer 1

You are posting the value of the file field only (if you alert it it's just the filename), and not the file itself, so PHP's $_FILES array is not getting populated with the actual file data.

To demonstrate, try this:

$(document).ready(function($) {
    $('#myFile').change(function() {
        alert($(this).val()); //will alert the filename
    });
});

If you want to get rid of the headache of ajax file uploading, have a look at jQuery Form Plugin and check out the ajax upload code samples.