DxUpload.FileUploadError Event

Fires if an error occurs during file upload.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v26.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public EventCallback<FileUploadErrorEventArgs> FileUploadError { get; set; }

Event Data

The FileUploadError event's data class is FileUploadErrorEventArgs. The following properties provide information specific to this event:

Property	Description
FileInfo	Returns information about a file. Inherited from FileUploadEventArgs.
RequestInfo	Returns information about a request’s response.

Remarks

The FileUploadError event occurs if a file was not uploaded to the server because of an error. If a file was uploaded successfully, the FileUploaded event occurs.

The following snippet handles the FileUploadError event and displays a custom error message that is passed from the server. Note that the code snippet uses Bootstrap classes. To render elements correctly, enable the UseBootstrapStyles option in theme settings.

Razor

<DxUpload Name="myFile"
          UploadUrl="https://localhost:10000/api/Upload/UploadFile/"
          FileUploadError="@OnUploadError" />

<div class="alert alert-danger @(ErrorVisible? " visible" : " invisible")">
    @MyError
</div>

@code {
    bool ErrorVisible { get; set; } = false;
    string MyError { get; set; }

    void OnUploadError(FileUploadErrorEventArgs e) {
        MyError = e.RequestInfo.ResponseText;
        ErrorVisible = true;
        InvokeAsync(StateHasChanged);
    }
}

UploadController

using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;

[Route("api/[controller]")]
public class UploadController : ControllerBase {
    private readonly IWebHostEnvironment _hostingEnvironment;

    public UploadController(IWebHostEnvironment hostingEnvironment) {
        _hostingEnvironment = hostingEnvironment;
    }

    [HttpPost]
    [Route("UploadFile")]
    public ActionResult UploadFile(IFormFile myFile) {
        // Check whether the file can be uploaded.
         // ...
         return BadRequest("An error occured during file upload.");
    }
}