confirm dialog to remove the files and Edit the Uploaded Files

[TOKO FIDELE]

hello. i use the uploadComponent with react, i have some problems:

1. Add confirm dialog to remove the files

when i implement according to the link below, when i delete the file the pop opens and at the same time the file is delete from the server. I would like to trigger the deletion of the file after clicking on the OK button of the popup

https://ej2.syncfusion.com/react/documentation/uploader/how-to/add-confirm-dialog-to-remove-the-files/

2. Uploader / How To / Open and Edit the Uploaded Files

I would like to have an example that shows Open and Edit the Uploaded Files. by following the link above I can not implement

https://ej2.syncfusion.com/react/documentation/uploader/how-to/open-and-edit-the-uploaded-files/#server-side-for-open-and-edit-the-uploaded-files

thank you so much

[Prince Oliver]

Hi Toko, 

Thank you for contacting us. 

Query 1: when i implement according to the link below, when i delete the file the pop opens and at the same time the file is delete from the server. I would like to trigger the deletion of the file after clicking on the OK button of the popup https://ej2.syncfusion.com/react/documentation/uploader/how-to/add-confirm-dialog-to-remove-the-files/ 

We have confirmed the reported issue “While removing the file, remove request is called without any form data if args.cancel is true in removing event” as a bug in our end. The fix for this issue will be included in our upcoming patch release scheduled on last week of July 2019. You can track the status of the reported issue through the below feedback link. 

Feedback Link: https://www.syncfusion.com/feedback/7595/  

 

Query 2: I would like to have an example that shows Open and Edit the Uploaded Files. by following the link above I can not implement 

https://ej2.syncfusion.com/react/documentation/uploader/how-to/open-and-edit-the-uploaded-files/#server-side-for-open-and-edit-the-uploaded-files 

We have prepared the local sample for “Open and Edit the Uploaded Files” and please find the sample in the below link. 

React Sample Link: https://www.syncfusion.com/downloads/support/forum/145967/ze/uploader-632082791 

MVC Backend sample: https://www.syncfusion.com/downloads/support/forum/145967/ze/uploader_filesize-472078309 

 

Note: You have to define the request header name in the web.config file to open and edit the file as mentioned in the below code example. 

[web.config] 

<httpProtocol> 

    <customHeaders> 

        <add name="Access-Control-Allow-Headers" 

            value="accept, maxdataserviceversion, origin, x-requested-with, dataserviceversion,content-type, chunk-index, Authorization, filePath" /> 

        <add name="Access-Control-Max-Age" value="104857600" /> 

        <add name="Access-Control-Allow-Origin" value="*" /> 

    </customHeaders> 

</httpProtocol> 

[App.tsx] 

public openFile(args: any, e: any) { 

    if (!e.target.classList.contains('e-file-delete-btn') && !e.target.classList.contains('e-file-remove-btn')) { 

        const ajax = new XMLHttpRequest(); 

        // create new request for open the selected file 

        ajax.open("POST", 'http://localhost:61835/Home/openFile'); 

        const liElements = document.getElementsByClassName('e-upload')[0].querySelectorAll('.e-upload-file-list') as any; 

        for (let i = 0; i < liElements.length; i++) { 

            if (liElements[i].getAttribute('data-file-name') = = = args.file.name) { 

                // Added the file path in header to get it in server side. 

                ajax.setRequestHeader('filePath', liElements[i].getAttribute('file-path').toString()); 

            } 

        } 

        ajax.send(); 

    } 

} 

Let us know if you need any further assistance on this. 

Regards, 

Prince 

[TOKO FIDELE]

 Add confirm dialog to remove the files

when i implement according to the link below, when i delete the file the pop opens and at the same time the file is delete from the server. I would like to trigger the deletion of the file after clicking on the OK button of the popup

https://ej2.syncfusion.com/react/documentation/uploader/how-to/add-confirm-dialog-to-remove-the-files/

thank

[Narayanasamy Panneer Selvam]

Hi TOKO, 

Thanks for your patience. 

We have included fix for the reported issue ‘when i delete the file the pop opens and at the same time the file is delete from the server.’ Kindly upgrade your Syncfusion package reference to latest version. For your convenience we have prepared a sample. 

Release notes: https://ej2.syncfusion.com/documentation/release-notes/17.2.36/#uploader 

Demo sample: https://stackblitz.com/edit/r1trna-95c5ej  

Regards, 

Narayanasamy P.