Jquery and HTML FormData returns "Uncaught TypeError: Illegal invocation"

Question

I'm using this script to upload my image files: http://jsfiddle.net/eHmSr/

$('.uploader input:file').on('change', function() {   $this = $(this);    $('.alert').remove();    $.each($this[0].files, function(key, file) {     $('.files').append('<li>' + file.name + '</li>');      data = new FormData();     data.append(file.name, file);      $.ajax({       url: $('.uploader').attr('action'),       type: 'POST',       dataType: 'json',       data: data     });   }); }); 

But when I click in upload button, the JavaScript console returns this error:

Uncaught TypeError: Illegal invocation  

Can you help me?

Answer 1

jQuery processes the data attribute and converts the values into strings.

Adding processData: false to your options object fixes the error, but I'm not sure if it fixes the problem.

Demo: http://jsfiddle.net/eHmSr/1/