Angular file explorer after upload a file i need to create a message popup once its reached the max allocated memory

[karthick]

Hello,

I'm using angular file manager and aspnet core web api in a project.

in file manager we are uploading files and validating files and given as response custom message. 

but I am unable to use failure method to capture the response from server

Client side:

onUploadFail(args)

  {

      let response = JSON.parse(args.e.target.response);

      args.statusText = response.message;       

      console.log(response.message);

  }

Server side:

Response.Clear();

Response.ContentType = "application/json; charset=utf-8";

Response.StatusCode = 404; //200

Response.Headers.Add("status","Custom Message");

if I send the statuscode as 404 means it will automatically trigger, file already exists popup, Instead of that I need to show a custom popup message.

kindly share the sample if available.

Thanks in advance

[Muthukrishnan Kandasamy]

 

Hi Karthick, 

 

Thanks for contacting Syncfusion support. 

 

We have validated your requirement in File Manager component. We can change the default message for upload fail and also get the custom error message in client side by using failure event in File Manager. Please refer to the below code block. 

 

// uploads the file(s) into a specified path 

        [Route("Upload")] 

        public IActionResult Upload(string path, IList<IFormFile> uploadFiles, string action) 

        { 

            FileManagerResponse uploadResponse; 

            uploadResponse = operation.Upload(path, uploadFiles, action, null); 

            if (uploadResponse.Error != null) 

            { 

               Response.Clear(); 

               Response.ContentType = "application/json; charset=utf-8"; 

               Response.StatusCode = Convert.ToInt32(uploadResponse.Error.Code); 

               Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = "Custom message"; 

            } 

            return Content(""); 

        } 

 

Please make the above changes in the following line with FileManagerController.cs file. 

 

https://github.com/SyncfusionExamples/ej2-aspcore-file-provider/blob/master/Controllers/FileManagerController.cs#L81 

 

<div class="sample-container"> 

  <ejs-filemanager 

    id="filemanager" 

    [ajaxSettings]="ajaxSettings" 

    (failure)="onFail($event)" 

  > 

  </ejs-filemanager> 

</div> 

 

  

 

 

 onFail(args) { 

    console.log(args.error.statusText); 

  } 

 

 

We have prepared sample application for your convenience, please refer to the below link for the sample. 

 

https://stackblitz.com/edit/angular-filemanager-core-service?file=app.component.html 

 

The attached ASP.NET Core file provider can be downloaded from the below link. 

 

https://www.syncfusion.com/downloads/support/forum/160989/ze/EJ2ASPCoreFileProvider1493667384 

 

Please check out the below output screenshot of the shared sample. 

 

 

 

 

Please refer to the below links to know more about File Manager component. 

 

Documentation: https://ej2.syncfusion.com/angular/documentation/file-manager/getting-started/ 

 

Demo: https://ej2.syncfusion.com/angular/demos/#/material/file-manager/overview 

 

API: https://ej2.syncfusion.com/angular/documentation/api/file-manager/ 

 

Please let us know, if you need any further assistance. 

 

Regards, 

Muthukrishnan K