We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Uploader rename file

Hello,

I would like to rename the file uploaded with EjsUploader but I can't do it neither before nor after uploading, I tried the following two ways:

1) Renaming the file server-side when it's uploaded but the client doesn't know the new name, so the remove function of Uploader can't work anymore

2) Sending the new name for the file as additional parameter doesn't work or I'm doing something not correct as it is not documented:

<EjsUploader @ref="_uploader" ID="uploadFiles" AllowedExtensions=".pdf" Multiple="false">
     <UploaderEvents BeforeUpload="RenameFile" />
     <UploaderAsyncSettings SaveUrl="uploader/upload" RemoveUrl="/remove" />
</EjsUploader>

private void RenameFile(BeforeUploadEventArgs e)
{
     e.CustomFormData = // Send the new file name, what object should I make?
}

[HttpPost("[action]")]
public void Upload(IList<IFormFile> uploadFiles)
{
     ...
}


I'd like it if someone could help me, thank you.

5 Replies 1 reply marked as answer

SP Sureshkumar P Syncfusion Team October 8, 2019 10:03 AM UTC

Hi Fabrizio, 

Greetings from Syncfusion support. 

Sure, before uploading and deleting, we can rename the file by passing the custom parameter in the event FileSelected and BeforeRemove. We created and attached the sample based on your requirement.  

Kindly refer to the code block. 
[index.razor] 

@using Syncfusion.EJ2.Blazor 
@using Syncfusion.EJ2.Blazor.Inputs 
 
<EjsUploader @ref="uploadObj" ID="UploadFiles" Multiple="false" AutoUpload="true"> 
 
    <UploaderAsyncSettings SaveUrl="api/Default/Save" RemoveUrl="api/Default/Remove"></UploaderAsyncSettings> 
    <UploaderEvents FileSelected="@Selected" BeforeRemove="@Remove"></UploaderEvents> 
 
</EjsUploader> 
 
 
@code{ 
    EjsUploader uploadObj; 
 
    FileInfo fileModel = new FileInfo(); 
 
    void Selected(SelectedEventArgs args) 
    { 
        // custom parameter in the selected event  
        args.CurrentRequest = new List<object> { new { FileName = "Testing" } }; 
    } 
 
    void Remove(BeforeRemoveEventArgs args) 
    { 
        // custom parameter in the before remove event  
        args.CurrentRequest = new List<object> { new { FileName = "Testing" } }; 
    } 
} 
 
 
[DefaultController.cs] 

[HttpPost("[action]")] 
        public void Save(IList<IFormFile> UploadFiles) 
        { 
            //getting filename using custom parameter 
            var FileName = Response.HttpContext.Request.Headers["FileName"].ToString(); 
            long size = 0; 
            try 
            { 
                foreach (var file in UploadFiles) 
                { 
                    var filename = ContentDispositionHeaderValue 
                            .Parse(file.ContentDisposition) 
                            .FileName 
                            .Trim('"'); 
                    filename = hostingEnv.ContentRootPath + $@"\{FileName}"; 
                    size += (int)file.Length; 
                    if (!System.IO.File.Exists(filename)) 
                    { 
                        using (FileStream fs = System.IO.File.Create(filename)) 
                        { 
                            file.CopyTo(fs); 
                            fs.Flush(); 
                        } 
                    } 
                } 
            } 
            catch (Exception e) 
            { 
                Response.Clear(); 
                Response.StatusCode = 204; 
                Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = "File failed to upload"; 
                Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = e.Message; 
            } 
        } 
        [HttpPost("[action]")] 
        public void Remove(IList<IFormFile> UploadFiles) 
        { 
            try 
            { 
                //getting filename using custom parameter 
                var FileName = Response.HttpContext.Request.Headers["FileName"].ToString(); 
                var filename = hostingEnv.ContentRootPath + $@"\{FileName}"; 
                if (System.IO.File.Exists(filename)) 
                { 
                    System.IO.File.Delete(filename); 
                } 
            } 
            catch (Exception e) 
            { 
                Response.Clear(); 
                Response.StatusCode = 200; 
                Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = "File removed successfully"; 
                Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = e.Message; 
            } 
        } 
    } 



Regards, 
Sureshkumar P


JA Jacky August 23, 2022 09:47 AM UTC

Hi Support ,


If I use Blazor SfUploader compoment, what is the best practice to rename upload file ?


Regards!

Jacky



SP Sureshkumar P Syncfusion Team August 24, 2022 06:51 AM UTC

Hi Jacky,

As per our previous update, you can rename the file before uploading or before deleting the file using the FileSelected and BeforeRemove events.

Note: If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Regards,

Sureshkumar P



JA Jacky August 25, 2022 03:23 AM UTC

Hi Sureshkumar  ,


I use the rename by the FileSelected and BeforeRemove events  trigger  is ok.

Above sample is controller to use  Response.HttpContext.Request.

But what  is the best practice to pass the rename to OnChange(UploadChangeEventArgs args)  for write rename file ?


My Sample as Attach file.


Best Regards!

Jacky





Attachment: BlazorApp1net6_Uploader_f1eb5044.zip


SP Sureshkumar P Syncfusion Team August 25, 2022 12:52 PM UTC

Hi Jacky,

We have passed the additional data (rename files) as a header when using the external API call. When we pass the rename to the OnChange event we can directly pass the rename string value using the variable.

Find the code example here:

@code {

    private SfUploader uploadObj { get; set; }

    private bool SetAutoUpload { get; set; } = false;

    private bool SetSequentialUpload { get; set; } = false;

 

    public string FileRename { get; set; }

        public string _uploadfilepath;

 

    protected override void OnInitialized()

    {

        //SaveUrl = $"{configuration.GetValue<string>("AppStrings:ServerLinkRoute")}/api/uploadbox/Save";

        //RemoveUrl = $"{configuration.GetValue<string>("AppStrings:ServerLinkRoute")}/api/uploadbox/Remove";

        _uploadfilepath = @"path";

    }

 

    public void OnFileRemove(RemovingEventArgs args)

    {

        args.PostRawFile = false;

    }

    public void OnFileBeforeRemove(BeforeRemoveEventArgs args)

    {

        FileRename = "Testing";

    }

    public void OnFileSelected(SelectedEventArgs args)

    {

        FileRename = "Testing";

    }

    public void OnAutoChange(Syncfusion.Blazor.Buttons.ChangeEventArgs<bool> args)

    {

        this.uploadObj.ClearAllAsync();

        this.SetAutoUpload = args.Checked;

    }

    public void OnSequentialChange(Syncfusion.Blazor.Buttons.ChangeEventArgs<bool> args)

    {

        this.uploadObj.ClearAllAsync();

        this.SetSequentialUpload = args.Checked;

    }

    private async Task OnChange(UploadChangeEventArgs args)

    {

        await fileUpload.UploadSfu(args.Files, "BZSF10", FileRename);      

    }

 

}

Find the modified sample in the attachment:

Note: If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Regards,

Sureshkumar P


Attachment: BlazorApp1net6_Uploader_fcc2213c.zip

Marked as answer
Loader.
Live Chat Icon For mobile
Up arrow icon