Jasny multiple file upload with other form elements

Question

I try to use Jasny fileupload to pass multiple files to php inside of a form, which on submit event should be uploaded via ajax posted datas. But I can't get it to work. I can not append jasny uploads to posted datas.

If there is a better workaround what would be better to implement instead jasny I would like to know about.

I init my upload fields as follows

jQuery('.fileupload').fileupload({});

I try to catch theme on submit

wizard.on("submit", function(wizard) {
    jQuery.ajax({
      //here When I serialize the form I do not get the files
    });
});

Answer 1

Try with

var data = new FormData();
jQuery.each($('#file')[0].files, function(i, file) {
  data.append('file-'+i, file);
});

So now you have a FormData object, ready to be sent along with the XMLHttpRequest.

$.ajax({
   url: 'php/upload.php',
   data: data,
   cache: false,
   contentType: false,
   processData: false,
   type: 'POST',
   success: function(data){
      alert(data);
   }
});

Answer 2

Please look at jQuery File Upload (https://github.com/blueimp/jQuery-File-Upload), it's support multiple files uploading and have backend implemented for PHP.