CODEWITHSUNDEEP
javascriptjqueryfile-uploadonclickonchange
tim peterson
tim peterson

Reputation: 24315

jQuery Blueimp fileupload plugin delete files without requiring checking checkbox first?

I can't figure out how to modify the jQuery Blueimp fileupload plugin jquery.fileupload-ui.js such that the delete button just deletes the files without having to check the checkbox first.

Might someone help me figure out how to do this?

here's the jquery.fileupload-ui.js code which appears to need some kind of modification:

 fileUploadButtonBar.find('.delete')
            .bind('click.' + ns, function (e) {
                e.preventDefault();
                filesList.find('.delete input:checked')
                    .siblings('button').click();
                fileUploadButtonBar.find('.toggle')
                    .prop('checked', false);
            });
        fileUploadButtonBar.find('.toggle')
            .bind('change.' + ns, function (e) {
                filesList.find('.delete input').prop(
                    'checked',
                    $(this).is(':checked')
                );
            });

Upvotes: 1

Views: 3988

Answers (2)

Nik Tsekouras
Nik Tsekouras

Reputation: 289

I came across with the same problem and the solution is quite simpler.

1.You have to remove from the html all the input checkboxes.
2.Add a class to the delete all button(i used deleteAll).
3.Each delete button has a class="delete" so..
4.Activate that button for each row, when click the top Delete button.

//delete all photos when click top Delete all button
$('.deleteAll').click(function(){
  $('.delete').each(function(){
    $(this).click();
  });
});

Upvotes: 2

tim peterson
tim peterson

Reputation: 24315

Ok I fixed my own problem. The solution is just to have the checkboxes attribute set to checked="checked" in the template and HTML before these elements are rendered. Trying to check the checkboxes with Javascript clicking on the button wasn't working for me probably having to do with the call stack.

Anyway, here's the code. In the template-download instead of this:

<input type="checkbox" name="delete" value="1">

do this:

<input type="checkbox" name="delete" value="1" checked="checked">

and for the checkbox next to the delete button in the fileuploadBar, instead of this:

<input type="checkbox" class="toggle">

do this: 

<input type="checkbox" class="toggle" checked="checked">

If you do this, then clicking any of the delete buttons will delete the file(s) (i.e., one step instead of two).

Upvotes: 1

Related Questions