Multiple uploads with single file instance

Question

I have a file upload page which is to upload multiple files at a time. Suppose if i upload 3 files following 4 files uploaded next with file input, at this time first 3 file items are removing from file instance.

When i uploading all the selected files to server it is receiving the last 4 file items only first uploaded file items are removed.

Could any one please help how to upload files using multiple file uploads with single file instance?

Here is the code i have used to get the file properties, I am calling a function addFiles on change event of fileinput button.

function addFiles(evt) {
    var eventReference = (typeof evt !== "undefined")? evt : window.event;
    if (eventReference.preventDefault) { 
        eventReference.preventDefault();
    } 
    var eventTarget =eventReference.dataTransfer;
    files=eventTarget.files; 
    for (var i = 0; file = files[i]; i++) {
        //getting the content from file and adding to table
    }
}

Answer 1

You can check out this plugin. I'm sure you will get what you want

I've used this in many project. Give a try to check to suit your requirement.