uploading a file using AJAX

Question

myI have been trying to upload a file to the server and I am having difficulties it seems that the file is not being sent to the server. I found this question How can I upload files asynchronously? But I cant see much being done differently in that example from what I have. I have the following form:

<form id = "selectFileForm" enctype="multipart/form-data" />
<input type = 'file' multiple ='multiple'>
</form>

then in javascript I have the following:

submitForm : function(){
    var uploadFormData = new FormData(document.getElementById("selectFileForm"));

    $.ajax({
        url : "myHandler.ashx/fileUpload",
        type: "POST",
        data : uploadFormData,
        processData : false,
        contentType : false
    });
}

In my handler(ASP 2.0) I have the following code:

private string fileUpload(HttpContext context)
{   
return context.Request.InputStream.Length.ToString();
}

This handler is giving me a response of 44 which seems small the file is definitely bigger than that. Which makes me believe the the file isn't getting sent in the request.

you might want to look into this .. http://stackoverflow.com/questions/16963787/file-upload-with-jquery-ajax-and-handler-ashx-not-working — spetzz, Apr 07 '14 at 15:47

Timigen · Accepted Answer · 2014-04-08T20:50:14.253

This answer did help me to resolve my issue... stackoverflow.com/questions/16963787/

Th problem was I needed to add this to my javascript

formData.append('file', $('#file')[0].files[0]);

This will work for a single file upload but if you are using the multiple option on an input type file, you will need a for loop that appends each file like so :

for(var i =0; i < files.length; i++)
{
    uploadFormData.append('file',files[i]);
}

uploading a file using AJAX

1 Answers1