Uploading multiple files with html5 and javascript

I have a uploading multiple files with html5 and javascript after uploading multiple files it get all data in form now i want to change the following code to get only new image data after upload no all form data. How is it in my code?

HTML:

<a href="javascript:doClick()" class="BrowseFile Button" >File browsing</a>

<input type="file" name="files[]" id="fileElem" multiple="multiple" accept="image/*" style="display:none;" onchange="handleFiles(this.files)">

JS:

function handleFiles(files) {
    var formData = new FormData($('.EditUserInfo')[0]);
    $.ajax({
        url: 'insert_image',
        type: 'POST',
        dataType: 'json',
        maxNumberOfFiles: 1,
        autoUpload: false,
        xhr: function() {
            myXhr = $.ajaxSettings.xhr();
            if (myXhr.upload) {
                myXhr.upload.addEventListener('progress', progressHandlingFunction, false);
            }
            return myXhr;
        },
        success: function(result) {
            console.log($.ajaxSettings.xhr().upload);

            alert('upload is done');

        },
        "error": function(x, y, z) {
            alert("An error has occured:\n" + JSON.stringify(x) + "\n" + JSON.stringify(y) + "\n" + JSON.stringify(z));
        },
        data: formData,
        cache: false,
        contentType: false,
        processData: false
    });

    function progressHandlingFunction(e) { // ***** I mean here. **** //
        if (e.lengthComputable) {
            
             alert('img size: '+e.loaded);

            //var percentComplete = Math.round(e.loaded * 100 / e.total);
            //$('.progress').text(percentComplete.toString() + '%');
            
        }
    }
}

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.