This is a migrated thread and some comments may be shown as answers.

Prevent selecting files with same filename

4 Answers 477 Views
Upload
This is a migrated thread and some comments may be shown as answers.
BigzampanoXXl
Top achievements
Rank 1
BigzampanoXXl asked on 11 Mar 2014, 11:48 AM
Hello,

I have an async fileupload in use. What I need is, that a file with the same name can only be selected once.

e.g.:
User selects: a.pdf, b.pdf, c.pdf
> All 3 files are shown in the file list

User selects: c.pdf, d.pdf
> Only d.pdf should be added to the file list, because c.pdf has already been added.

User uploads files
> a.pdf, b.pdf, c.pdf, d.pdf get uploaded...

I don't care if its exactly the same file - just a comparison to the filename is enough. What I tried is to manipulate the select-event:
OnSelect: function (e)
{
    var selectedFiles = $(".k-upload-files li #fileName");
 
    e.files = $.grep(e.files, function (value)
    {
        for (var i = 0; i < selectedFiles.length; i++)
        {
            if (selectedFiles[i].innerHTML == value.name)
                return false;
        }
 
        return true;
    });
}

Well, that doesn't work so far. The list of files gets minimized correctly but the files are still added to the FileList. Hope someone can help me.

Thank you!

4 Answers, 1 is accepted

Sort by
0
Accepted
Dimiter Madjarov
Telerik team
answered on 12 Mar 2014, 09:06 AM
Hello Dietmar,


This could be achieved, but with one limitation - when the user selects multiple files and the select event gets prevented, none of them will be added to the list. In your example - when the user selects c.pdf and d.pdf, none of them will get selected.
Regarding the exact implementation, it may depend, but here is a sample one.
E.g.
function select(e) {
    var selected = e.files;
    var filesInList = $(".k-upload-files .k-filename");
 
    for (var i = 0; i < selected.length; i++) {
        var filename = selected[i].name;
 
        filesInList.each(function () {
            if ($(this).text() === filename) {
                e.preventDefault();
            }
        });
    }
}


Regards,
Dimiter Madjarov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
BigzampanoXXl
Top achievements
Rank 1
answered on 12 Mar 2014, 09:12 AM
Hello Dimiter,

thank you for your answer but exactly that limitation is the problem. When the user selects multiple files, only the existing files should be prevented to be added to the filelist. Is there somehow a workaround for that? I tried to manipulate the files of the control manually but it seems that i don't have access to them (e.g. like a grids DataSource)

Thank you!
0
Dimiter Madjarov
Telerik team
answered on 12 Mar 2014, 09:31 AM
Hello Dietmar,


You are correct, that the files collection could not be manipulated inside the event handler and there is no workaround for this. Please excuse us for the inconvenience caused.

Regards,
Dimiter Madjarov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
BigzampanoXXl
Top achievements
Rank 1
answered on 12 Mar 2014, 09:40 AM
Hello Dimiter,

thank you for your answer. I will do it your way, preventing the whole event and throwing an alert.
Hopefully this feature will be available / possible to implement in the future.

Best Regards,
Dietmar
Tags
Upload
Asked by
BigzampanoXXl
Top achievements
Rank 1
Answers by
Dimiter Madjarov
Telerik team
BigzampanoXXl
Top achievements
Rank 1
Share this question
or