How to detect action on removing a file. (This is not the Clear button.)

[j]

Hello,

   I am still using the old 17.3.29 version but checking on the API looks like I couldn't find a method that is being called whenever the X button is clicked to remove a file. I'm talking about the removing of a single file not the Clear button that removes the entire selected file to be uploaded.

Thanks,

[Berly Christopher]

Hi J, 

  

Greetings from Syncfusion support. 

  

We would like to inform you that we have provided remove event for the Uploader component. This event will be triggered when u clear the single file instead whole list. Please find the sample and code snippet below. 

  

<EjsUploader ID="UploadFiles" DropArea=".control-fluid"> 

    <UploaderEvents OnRemove="OnFileRemove"></UploaderEvents> 

    <UploaderAsyncSettings SaveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Save" RemoveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Remove"></UploaderAsyncSettings> 

</EjsUploader> 

 

@code{ 

    public void OnFileRemove() 

    { 

        Console.WriteLine("File has been removed"); 

    } 

} 

  

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Uploader_Remove-1584903088  

API Link: https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Inputs.UploaderEvents.html#Syncfusion_Blazor_Inputs_UploaderEvents_OnRemove  

  

Regards, 

Berly B.C 

[Andy Corrigan]

Just to keep this up-to-date as it's still the first result on Google for anyone having issues; there is an optional parameter for this code that allows you to pick up the details of the file being removed if needs be. 

<SfUploader @ref="uploader" MaxFileSize="@MaxSize" Files="uploadedFiles" AllowedExtensions=".doc, .docx, .pdf, .xls, .xlsx, .ppt, .pptx, .jpg, .jpeg, .bmp, .png" AllowMultiple="true" AutoUpload="true">
    <UploaderEvents ValueChange="OnFileUpload" OnRemove="OnFileRemove" />
</SfUploader>

private async Task OnFileRemove(RemovingEventArgs args)
{
    foreach (var file in args.FilesData)
    {
        var fileName = file.Name;
        //Process file here
    }
}

[Berly Christopher]

Hi Andy, 

  

We can send the optional parameter in the remove event with help of lambda expression in the Uploader component as mentioned below. 

  

  

 

<SfUploader @ref="uploader" MaxFileSize="@MaxSize"  AllowedExtensions=".doc, .docx, .pdf, .xls, .xlsx, .ppt, .pptx, .jpg, .jpeg, .bmp, .png" AllowMultiple="true" AutoUpload="true"> 

    <UploaderEvents ValueChange="OnFileUpload" OnRemove="@(e => OnFileRemove(e, "Date"))" /> 

</SfUploader> 

 

@code{ 

    SfUploader uploader; 

    public int MaxSize { get; set; } 

    public void OnFileUpload() 

    { 

 

    } 

    private async Task OnFileRemove(RemovingEventArgs args, string optionalParam) 

    { 

        foreach (var file in args.FilesData) 

        { 

            var fileName = file.Name; 

            //Process file here 

        } 

    } 

} 

 

  

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Uploader_Remove-340316983  

  

Regards, 

Berly B.C