Programmatic file upload with chunking: Only the first file is sent
blueimp, file-upload, jquery
Solution
If you use C# as back-end, you can try this (Client-Side, JQuery):
$("#btnUpload").click(function () { // btnUpload is the ID of any button for upload
var formdata = new FormData(); //FormData object
var fileInput = document.getElementById('fileInput');
//Iterating through each files selected in fileInput
for (i = 0; i < fileInput.files.length; i++) {
//Appending each file to FormData object
formdata.append(fileInput.files[i].name, fileInput.files[i]);
}
//Creating an XMLHttpRequest and sending
var xhr = new XMLHttpRequest();
xhr.open('POST', '/UploadMethod'); // UploadMethod is your back-end code
xhr.send(formdata);
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
// alert("uploaded");
}
}
});
and then in you UploadMethod do something like this: (ServerSide , C#)
public void Upload()
{
for (int i = 0; i < Request.Files.Count; i++)
{
HttpPostedFileBase file = Request.Files[i]; //Uploaded file
//Use the following properties to get file's name, size and MIMEType
int fileSize = file.ContentLength;
string fileName = file.FileName;
string mimeType = file.ContentType;
System.IO.Stream fileContent = file.InputStream;
//To save file, use SaveAs method
var appPath = HostingEnvironment.ApplicationPhysicalPath + "Documents/" + "_" + DateTime.Now+ fileName;
file.SaveAs(appPath); //File will be saved in Documents folder
}
}
Problem
When doing a programmatic file upload using the jQuery-File-Upload plugin with chunking enabled I can not get more than one file to be sent. I am making the call as follows: ``` fileUploadWidget.fileupload('send', { files: filesList }) ``` `filesList` is a list of File objects. Also I have set maxChunkSize and set singleFileUploads to true (I also tried false) as indicated on the Options wiki page. Has anyone had any success getting this to work? Update: I'd made an issue on GitHub for this problem and here's the response from the author: [...] Chunked uploads only support one file per request. That is, you can still simultaneously upload multiple files in chunks, but you'll have to send mutliple requests for that. Our Solution: As has been already commented, and what we ended up doing, was to send the files in a loop where `widget` was initialized with sequentialUploads set to `true` (you'll want this depending on how your backend is configured): ``` // for illustration only // does not do anything with the returned jqXHR objects for (i = 0; i < files.length; i++) { widget.fileupload('send', { files: files[i] }); } ```