CODEWITHSUNDEEP
jqueryajaxformsupload
schaenk
schaenk

Reputation: 257

Ajax form submit with file upload using jquery

I'm trying to submit a form with one text- and one file upload field by ajax using jQuery.

$("#myForm").submit(function() {
    var formData = new FormData($(this)[0]);
    $.ajax({
        url: $(this).attr("action"),
        type: "POST",
        data: formData,
        async: false,
        cache: false,
        contentType: false,
        proccessData: false,
        success: function() {
            // do something smart here
        }
    });
});

On submit, i only got a error Illegal operation on WrappedNative prototype object, because the ajax request is trying to send the whole DOM from the form.

How do i send the data correctly?

$(this).serialize() would be the option, if i only want to send text, but i'm trying to send text AND upload a file at the same time.

Thanks for your help!

Upvotes: 2

Views: 18269

Answers (1)

lalith458
lalith458

Reputation: 695

Try this one,

$("#pushform").submit(function(){
var formData = new FormData($(this)[0]);

$.ajax({
url:$(this).attr("action"),
type: 'POST',
data: formData,
async: false,
success: function (data) {
alert(data);
location.reload();
},
cache: false,
contentType: false,
processData: false
});
return false;

Upvotes: 2

Related Questions