Remove a file from async upload list.

[Jed]

I have a kendo upload on one of my forms. This upload button has the following async, multiselect, autoUpload = false, batch = true. The problem I am running into is if the user selects 5 files, but meant to only select 4, they click the remove icon for that row.

I am having issues removing that file from the file portion of the upload control. If I select 5 and then remove them all, the upload is still acting as if all 5 are there. kendoUpload.getFiles() is always showing me every file they selected.

 

Just be clear, I am trying to remove a file from memory before the user fully uploads them. The process is that they select the files, the files populate a grid, and then once the user is ready they click an 'upload' button that will fire off the server call. Prior to them clicking upload everything is client side.

[Neli]

Hi Jed,

I tested the described behavior in the Dojo linked here. However, the getFiles method is always returning the correct count of files, even after removing a file. Could you please take a look at the example and let me know if I am missing something?

Looking forward to your reply.

Regards,
Neli
Progress Telerik

[Jed]

Yes I can see the Dojo is functioning correctly. Our situation is slightly different in that we are using a separate remove button because of other actions that will need to take place at the same time. In the function that is called when they click the remove button I have been trying to get the removeFile method to remove the selected file, but doesn't seem to ever remove anything. The removeFileByUid is not working either.  Below is the code for our remove function

 

self.deleteFile = function (data) {
        var grid = $("#" + self.MultipleUploadDetailsGridId).data("kendoGrid");
        var dataitem = this.dataItem($(data.currentTarget).closest("tr"));

        grid.dataSource.remove(dataitem);
        self.MultipleUploadDetails.remove(function (uploadDetail) {
            return uploadDetail.FileName == dataitem.FileName;
        });
        self.UploadDocuments.remove(function (uploadDoc) {
            var nameNoExtension = uploadDoc.name.substring(0, uploadDoc.name.length - uploadDoc.extension.length);
            return nameNoExtension == dataitem.FileName;
        });

        var upload = $("#" + self.MultipleUploadButtonId).data("kendoUpload");
        //Remove method here

        grid.dataSource.sync();
    };

[Jed]

After testing I wanted to add some details.

We want the ability to let the users select multiple files at once, but to be able to remove a single file from the group. All files have to get sent in a single controller call (so batch has to be true).

I am noticing that when I set batch to false, I can successfully delete a single file, but that introduces the problem of all the files not being sent in a single call.

Hopefully that makes sense.

 

edit: It is also worth noting that we are using a separate grid to show the selected files. This is due to the fact that each file has the possibility of having other information associated with them.

[Neli]

Hi Jed,

Currently uploading multiple files and removing a single one is not supported when the batch option is enabled.

I would suggest you log the idea in our official Feedback Portal. This way the other users could vote for the request. The most popular requests are considered for future implementation. 

- https://feedback.telerik.com/kendo-jquery-ui

Regards,

Neli