CODEWITHSUNDEEP
jqueryjquery-file-uploadblueimp
Manish Kumar
Manish Kumar

Reputation: 10482

Blueimp File Upload: file is not deleting correctly from queue

I am having following blueimp file upload code:

.on('fileuploadadd', function (e, data) {
   data.context = $('<div/>').appendTo('#FilesListThumb');
   $.each(data.files, function (index, file) {
         var node = $("<div><h6 fileId="+index+">X</h6></div>").addClass("thumbnail-ib");
         node.appendTo(data.context);
         node.find("h6").click(function(){
              data.files.splice($(this).attr("fileId"),1);
              node.remove();
         });
 });

When i click h6 sometimes it removes files from queue sometimes not.Why? Next question is how to remove all files from queue?

Upvotes: 2

Views: 1945

Answers (1)

Fractaliste
Fractaliste

Reputation: 5957

I suggest you to use an incremented global variable instead of the index value:

var globalVariable = 0; // To be declare in a global context

.on('fileuploadadd', function (e, data) {
    data.context = $('<div/>').appendTo('#FilesListThumb');
    $.each(data.files, function (index, file) {
        globalVariable = globalVariable + 1;
        var node = $("<div><h6 fileId=" + globalVariable + ">X</h6></div>").addClass("thumbnail-ib");
        file.fileId = globalVariable; // Add the same id to the file
        node.appendTo(data.context);
        node.find("h6").click(function(){
            $.each(data.files, function (index, file) {
                if(file.fileId == $(this).attr("fileId"){
                     data.files.splice(index, 1);
                     return false; // Break the loop
            };
            node.remove();
        });
    });
});

To remove files from the queue you can look at the following question on SO (I like the tanguy_k's answer) : How do I empty an array in JavaScript? and apply it to the data.files array.

Upvotes: 3

Related Questions