Uploader. Selecting multiple files consecutively only uploads last file dropped or selected.

[John Stemper]

When selecting multiple files consecutively with the uploader control, each placed on the control individually, the files are shown in the box but only the last file dropped is uploaded to the server.

I am uploading the files as part of the form post back.

    @Html.EJS().Uploader("UploadFiles").Multiple(true).AutoUpload(false).Selected("onSelect").Render()

Script:

 function onSelect(e) {

            this.element.files = e.event.dataTransfer.files;

        }

[Berly Christopher]

Hi John, 

 

  

Greetings from Syncfusion support. 

 

  

We can get the file name in the Synchronous upload (Inside the form) while choosing multiple files at the same time only. We can get the last selected file if we select multiple files one by one. This issue is known issue in the HTML 5 File Upload component.  

   

So, we are currently implementing the below mentioned feature in the Uploader component. Once it will be implemented the reported issue will be fixed and this support will be available in the Volume 3 release expected in the month of October 2019. You can track the status of this feature from the below feedback link.   

 

Feedback Link: https://www.syncfusion.com/feedback/4594/clear-all-option-instead-of-individual-click-while-enable-synchronous-form-upload  

  

Regards,  

Berly B.C 

[Juan Jiminez]

Hi SF,

Sorry for stepping in this one but it has been a year since the fix request was created and I'm experiencing this issue with the latest release.

Any updates on when this will be fixed or is this discarded by now?

The issue is selecting the files one by one on syncronous upload as opposed to selected all at the same time. When you browse each file separately, only the last file is posted.

Thanks in advance.

[Prince Oliver]

Hi John, 

Thank you for you update. 

This feature is available since the version v17.3.26. Kindly refer to the following release notes section:  

https://ej2.syncfusion.com/documentation/release-notes/17.3.26/?_ga=2.34084193.1574846466.1606711557-1247197356.1580807994#uploader 

We suspect that you might have used the HttpPostedFileBase to get the files in the form post instead of using IList<HttpPostedFileBase> in your end.  

        [HttpPost] 

        public ActionResult Index(IList<HttpPostedFileBase> UploadFiles) 

        { 

            return View(); 

        } 

  

Sample: https://www.syncfusion.com/downloads/support/forum/147065/ze/EJ2_MVC1331483898  

Kindly check the above suggestion and get back to us, if you still face any issue. 

Regards, 

Prince 

[Juan Jiminez]

Hi Prince,

Thanks fo the follow up, the issue is still present if you use the image preview feature, I've created a new ticket for this other issue https://www.syncfusion.com/forums/160218/uploader-selecting-multiple-files-consecutively-only-uploads-last-file-when-using-preview

[Sevvandhi Nagulan]

Hi Juan, 

Thanks for the update. Please let us know if you need further assistance. 

Regards, 

Sevvandhi N 

[Cedric Baynard]

Can you provide and example of how to use the clearAll() method to resolve this issue?

[Joseph Christ Nithin Issack]

   Hello Cedric, 

     Greetings from Syncfusion support, 

     We have checked your query, It would be helpful if you mention the issue you are facing in detail so that we would be able to provide the sample more precisely. 

Regards, 

Joseph Christ Nithin I. 

[Cedric Baynard]

Thank you for your reply.   We are having the issue where only the last file is returned when selecting multiple files with the ejs-loader control. This thread referenced a fix by Syncfusion that talked about performing a "Clear All" instead of a remove?   I was seeking clarification on what if any resolution for this problem of passing only the last file back.   Is there any way of preventing the ejs-control browse button from being clicked more than once?   I know that your control captures multiple "files" from browse on the inital form instance and works properly in sending all files when you only browse 1x to select the files.

[Joseph Christ Nithin Issack]

Hello Cedric, 

   

   Thanks for the update. We have checked your query.  

Query 1: I was seeking clarification on what if any resolution for this problem of passing only the last file back. Is there any way of preventing the ejs-control browse button from being clicked more than once? 

To prevent the browse button being clicked more than once, the browse button can be disabled by setting the ‘disable’ property of the ‘browseButton’ true on the ‘onSelect’ event. 

<div style="margin-top:20px;margin-left:20px;"> 

 

    @Html.EJS().Uploader("UploadFiles").DropArea(".control-fluid").Multiple(false).AutoUpload(false).Selected("onSelect").Clearing("onClearing").Removing("onRemoving").Render() 

</div> 

 

<script> 

    function onSelect(args) { 

        disableBrowse(args); 

    } 

 

    function onClearing(args) { 

        disableBrowse(args); 

    } 

 

    function onRemoving(args) { 

        disableBrowse(args); 

    } 

 

    function disableBrowse(args) { 

        var uploadObj = document.getElementById("UploadFiles").ej2_instances[0]; 

        var filesData = uploadObj.getFilesData(); 

        var allFiles = filesData.concat(args.filesData); 

        var browseButton = uploadObj.browseButton; 

        browseButton.disabled = allFiles.length == 1 ? true : false; 

    }  

</script> 

Query 2: I know that your control captures multiple "files" from browse on the inital form instance and works properly in sending all files when you only browse 1x to select the files. 

It is possible to prevent the uploader from uploading more than one file by setting the ‘Multiple’ property as false.  

Sample: https://www.syncfusion.com/downloads/support/forum/147065/ze/Test_DropDown970495508 

Please find the attached sample and revert for more queries. 

Regards, 

Joseph Christ Nithin I