Uploader events and multiple=false keeps old files

Hello,

I am trying to implement an upload within a form. I am using autoUpload=true, multiple=false. Following observations:
  • events like "actionComplete" and "change" include multiple file infos when user uploads files multiple times although the file list shows only 1 file (the last uploaded)... why? I also wonder why the user is still able to upload multiple times with multiple=false.
  • event "change" is not triggered for removed uploads (using trash icon after upload was complete)... why?
  • event "actionComplete" is not triggered again when uploaded a file after a file has already been uploaded... why?
  • event "success" is triggered for aborted uploads... why?
  • how can I disable the feature "delete" on uploaded files? It should remain until another file is uploaded.
Please help me. I am using v18.2.58.

Have a nice day,
Steffen Harbich

3 Replies 1 reply marked as answer

JM Jeyanth Muthu Pratheeban Sankara Subramanian Syncfusion Team March 3, 2021 04:31 PM UTC

Hi Steffen,

Greetings from Syncfusion support.

We have checked your query. Please find the details below.

Query 1:

events like "actionComplete" and "change" include multiple file infos when user uploads files multiple times although the file list shows only 1 file (the last uploaded)... why? I also wonder why the user is still able to upload multiple times with multiple=false.

Response:

We have checked in actioncomplete and change events. We could not reproduce this with actioncomplete event. Also we suggest you to use selected event which triggers on every file is getting selected.

Query 2 & 3:

event "change" is not triggered for removed uploads (using trash icon after upload was complete)... why? 
event "actionComplete" is not triggered again when uploaded a file after a file has already been uploaded... why?

Response:

 
We could not reproduce this issue and change and actioncomplete triggers for removing the uploaded files in our end.

Query 4:

 
event "success" is triggered for aborted uploads... why?

Response:

We would like to know you that success event will be triggered for every operation is successfully completed. You can differentiate the operations with the help of operation obtained in the success event arguments.

Here we have attached the ensured sample in the below link

Sample Link : https://stackblitz.com/edit/react-z4zqdl?file=index.js

Query 5:

how can I disable the feature "delete" on uploaded files?

Response:

You can add “e-disable” class to the delete icon in the success event so that the icon remains in the disabled state. We have made sample for your convenience. Please find the sample in the below link.

Sample Link : https://stackblitz.com/edit/react-z4zqdl-yszcph?file=index.js

Regards, 
Jeyanth. 



SH Steffen Harbich replied to Jeyanth Muthu Pratheeban Sankara Subramanian March 4, 2021 03:31 PM UTC

Hi Steffen,

Greetings from Syncfusion support.

We have checked your query. Please find the details below.

Query 1:

events like "actionComplete" and "change" include multiple file infos when user uploads files multiple times although the file list shows only 1 file (the last uploaded)... why? I also wonder why the user is still able to upload multiple times with multiple=false.

Response:

We have checked in actioncomplete and change events. We could not reproduce this with actioncomplete event. Also we suggest you to use selected event which triggers on every file is getting selected.

Query 2 & 3:

event "change" is not triggered for removed uploads (using trash icon after upload was complete)... why? 
event "actionComplete" is not triggered again when uploaded a file after a file has already been uploaded... why?

Response:

 
We could not reproduce this issue and change and actioncomplete triggers for removing the uploaded files in our end.

Query 4:

 
event "success" is triggered for aborted uploads... why?

Response:

We would like to know you that success event will be triggered for every operation is successfully completed. You can differentiate the operations with the help of operation obtained in the success event arguments.

Here we have attached the ensured sample in the below link

Sample Link : https://stackblitz.com/edit/react-z4zqdl?file=index.js

Query 5:

how can I disable the feature "delete" on uploaded files?

Response:

You can add “e-disable” class to the delete icon in the success event so that the icon remains in the disabled state. We have made sample for your convenience. Please find the sample in the below link.

Sample Link : https://stackblitz.com/edit/react-z4zqdl-yszcph?file=index.js

Regards, 
Jeyanth. 


>Response:
>We have checked in actioncomplete and change events. We could not reproduce this with actioncomplete event.

Ok but why is it reproducible for "change" event? With "multiple=false" it should not contain multiple files at any event at anytime, isn't it?
(see https://stackblitz.com/edit/syncfusion-uploader-issues?file=index.js and upload files multiple times, then in console watch out for "Change" logs and see that file array contains more than 1)

>Also we suggest you to use selected event which triggers on every file is getting selected.

I can't use "selected" event because I need to know when upload completed. I am working around the issue above by using the last entry of the "file" array.


>Query 2 & 3:
>event "change" is not triggered for removed uploads (using trash icon after upload was complete)... why? 
>event "actionComplete" is not triggered again when uploaded a file after a file has already been uploaded... why?
>Response:
>We could not reproduce this issue and change and actioncomplete triggers for removing the uploaded files in our end.

When no removeUrl in asyncSettings is specified then no "change" or "actionComplete" event is triggered on removing the file from list, see my example.
This is not a problem for me because I don't want a "remove" to be available in the file list at all.


>Response:
> We would like to know you that success event will be triggered for every operation is successfully completed.
>You can differentiate the operations with the help of operation obtained in the success event arguments.

Ok, this is unexpected for me to have a "success" but the upload wasn't really successful because of cancellation. But nevermind.


>Response:
> You can add “e-disable” class to the delete icon in the success event so that the icon remains in the disabled state.
> We have made sample for your convenience. Please find the sample in the below link.

Thanks, I will try and report back if I have further problems.



JM Jeyanth Muthu Pratheeban Sankara Subramanian Syncfusion Team March 5, 2021 09:06 AM UTC

Hi Steffen,

Thanks for the elaboration. 

We have checked your query. Please find the details below.

Query 1:

I can't use "selected" event because I need to know when upload completed. I am working around the issue above by using the last entry of the "file" array.

Response :

We would like to know you that “Success” event will trigger on every successful operation. As stated in the previous update, you can differentiate the operation with the help of “operation” in the event arguments. According to your requirement, you are in need of getting the file information after the file has been uploaded. So we suggest you to use the success event with the operation as upload.

We have modified your sample. Please find the sample in the below link.

Sample Link : https://stackblitz.com/edit/syncfusion-uploader-issues-59mf25

Code Snippet:


 
onSuccess(args) { 
        if (args.operation == "upload") { 
          document.getElementById("list").innerText = args.file.name; 
        } 
        console.log("success"args); 
      } 



Screenshot:


 
 


Query 2:

When no removeUrl in asyncSettings is specified then no "change" or "actionComplete" event is triggered on removing the file from list.

Response:

We would like to let you know that selected file will be uploaded based on the endpoints provided in the asyncSettings. Can you please provide the use case scenario of using the File Uploader without asyncSettings property? However, selected event would trigger on selecting files. You can get the file details for this case.

Regards, 
Jeyanth. 


Marked as answer
Loader.
Up arrow icon