Class RadzenUpload

A file upload component with progress tracking, multiple file support, and drag-and-drop capability. RadzenUpload provides a full-featured file upload interface with automatic or manual upload, server communication, and comprehensive event handling. Handles file selection and upload to a server endpoint with automatic upload on file selection or manual triggering via Upload() method, real-time upload progress with percentage and bytes loaded, file type restriction via Accept property (MIME types or extensions), custom authentication or HTTP headers, Complete/Error/Progress/Change events for tracking upload lifecycle, automatic image preview for image files, file removal support, and built-in drag-and-drop for file selection. Uploads files to the URL endpoint via HTTP POST multipart/form-data. Server-side endpoint must accept file uploads and return appropriate responses.

Inheritance

object

ComponentBase

RadzenComponent

RadzenUpload

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable

Inherited Members

RadzenComponent.OnMouseEnter()

RadzenComponent.OnMouseLeave()

RadzenComponent.OnContextMenu(MouseEventArgs)

RadzenComponent.GetCssClass()

RadzenComponent.GetId()

RadzenComponent.Debounce(Func<Task>, int)

RadzenComponent.OnInitialized()

RadzenComponent.RaiseContextMenu(MouseEventArgs)

RadzenComponent.RaiseMouseEnter()

RadzenComponent.AddContextMenu()

RadzenComponent.RaiseMouseLeave()

RadzenComponent.Dispose()

RadzenComponent.Attributes

RadzenComponent.Element

RadzenComponent.MouseEnter

RadzenComponent.MouseLeave

RadzenComponent.ContextMenu

RadzenComponent.Culture

RadzenComponent.DefaultCulture

RadzenComponent.Style

RadzenComponent.Visible

RadzenComponent.UniqueID

RadzenComponent.JSRuntime

RadzenComponent.IsJSRuntimeAvailable

RadzenComponent.Reference

RadzenComponent.CurrentStyle

ComponentBase.OnInitializedAsync()

ComponentBase.OnParametersSet()

ComponentBase.OnParametersSetAsync()

ComponentBase.StateHasChanged()

ComponentBase.ShouldRender()

ComponentBase.OnAfterRender(bool)

ComponentBase.InvokeAsync(Action)

ComponentBase.InvokeAsync(Func<Task>)

ComponentBase.DispatchExceptionAsync(Exception)

object.GetType()

object.MemberwiseClone()

object.ToString()

object.Equals(object)

object.Equals(object, object)

object.ReferenceEquals(object, object)

object.GetHashCode()

Namespace: Radzen.Blazor

Assembly: Radzen.Blazor.dll

Syntax

public class RadzenUpload : RadzenComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable

Examples

Basic upload with auto-upload:

<RadzenUpload Url="api/upload" Complete=@OnComplete />
@code {
    void OnComplete(UploadCompleteEventArgs args)
    {
        Console.WriteLine($"Uploaded {args.Files.Count} files");
    }
}

Manual upload with progress tracking:

<RadzenUpload @ref=upload Url="api/upload" Auto="false" Multiple="true" Progress=@OnProgress />
<RadzenButton Text="Upload" Click=@(() => upload.Upload()) />
@code {
    RadzenUpload upload;
    void OnProgress(UploadProgressArgs args)
    {
        Console.WriteLine($"Progress: {args.Progress}% ({args.Loaded}/{args.Total} bytes)");
    }
}

Upload with file type filtering:

<RadzenUpload Url="api/upload/images" Accept="image/*" MaxFileSize="5000000" />

Constructors

RadzenUpload()

A file upload component with progress tracking, multiple file support, and drag-and-drop capability. RadzenUpload provides a full-featured file upload interface with automatic or manual upload, server communication, and comprehensive event handling. Handles file selection and upload to a server endpoint with automatic upload on file selection or manual triggering via Upload() method, real-time upload progress with percentage and bytes loaded, file type restriction via Accept property (MIME types or extensions), custom authentication or HTTP headers, Complete/Error/Progress/Change events for tracking upload lifecycle, automatic image preview for image files, file removal support, and built-in drag-and-drop for file selection. Uploads files to the URL endpoint via HTTP POST multipart/form-data. Server-side endpoint must accept file uploads and return appropriate responses.

Declaration

public RadzenUpload()

Examples

Basic upload with auto-upload:

<RadzenUpload Url="api/upload" Complete=@OnComplete />
@code {
    void OnComplete(UploadCompleteEventArgs args)
    {
        Console.WriteLine($"Uploaded {args.Files.Count} files");
    }
}

Manual upload with progress tracking:

<RadzenUpload @ref=upload Url="api/upload" Auto="false" Multiple="true" Progress=@OnProgress />
<RadzenButton Text="Upload" Click=@(() => upload.Upload()) />
@code {
    RadzenUpload upload;
    void OnProgress(UploadProgressArgs args)
    {
        Console.WriteLine($"Progress: {args.Progress}% ({args.Loaded}/{args.Total} bytes)");
    }
}

Upload with file type filtering:

<RadzenUpload Url="api/upload/images" Accept="image/*" MaxFileSize="5000000" />

Fields

fileUpload

Gets file input reference.

Declaration

protected ElementReference fileUpload

Field Value

Type	Description
ElementReference

Properties

Accept

Gets or sets the accepted MIME types.

Declaration

[Parameter]
public string Accept { get; set; }

Property Value

Type	Description
string	The accepted MIME types.

Auto

Gets or sets a value indicating whether this RadzenUpload upload is automatic.

Declaration

[Parameter]
public bool Auto { get; set; }

Property Value

Type	Description
bool	true if upload automatic; otherwise, false.

Change

Gets or sets the change callback.

Declaration

[Parameter]
public EventCallback<UploadChangeEventArgs> Change { get; set; }

Property Value

Type	Description
EventCallback<UploadChangeEventArgs>	The change callback.

ChildContent

Gets or sets the child content.

Declaration

[Parameter]
public RenderFragment ChildContent { get; set; }

Property Value

Type	Description
RenderFragment	The child content.

ChooseText

Gets or sets the choose button text.

Declaration

[Parameter]
public string ChooseText { get; set; }

Property Value

Type	Description
string	The choose button text.

Complete

Gets or sets the complete callback.

Declaration

[Parameter]
public EventCallback<UploadCompleteEventArgs> Complete { get; set; }

Property Value

Type	Description
EventCallback<UploadCompleteEventArgs>	The complete callback.

DeleteText

Gets or sets the choose button text.

Declaration

[Parameter]
public string DeleteText { get; set; }

Property Value

Type	Description
string	The choose button text.

Disabled

Gets or sets a value indicating whether this RadzenUpload is disabled.

Declaration

[Parameter]
public bool Disabled { get; set; }

Property Value

Type	Description
bool	true if disabled; otherwise, false.

Error

Gets or sets the error callback.

Declaration

[Parameter]
public EventCallback<UploadErrorEventArgs> Error { get; set; }

Property Value

Type	Description
EventCallback<UploadErrorEventArgs>	The error callback.

HasValue

Gets a value indicating whether this instance has value.

Declaration

public bool HasValue { get; }

Property Value

Type	Description
bool	true if this instance has value; otherwise, false.

Icon

Gets or sets the icon.

Declaration

[Parameter]
public string Icon { get; set; }

Property Value

Type	Description
string	The icon.

IconColor

Gets or sets the icon color.

Declaration

[Parameter]
public string IconColor { get; set; }

Property Value

Type	Description
string	The icon color.

ImageAlternateText

Gets or sets the text.

Declaration

[Parameter]
public string ImageAlternateText { get; set; }

Property Value

Type	Description
string	The text.

InputAttributes

Specifies additional custom attributes that will be rendered by the input.

Declaration

[Parameter]
public IReadOnlyDictionary<string, object> InputAttributes { get; set; }

Property Value

Type	Description
IReadOnlyDictionary<string, object>	The attributes.

MaxFileCount

Gets or sets the maximum number of files.

Declaration

[Parameter]
public int MaxFileCount { get; set; }

Property Value

Type	Description
int	The maximum number of files.

Multiple

Gets or sets a value indicating whether this RadzenUpload is multiple.

Declaration

[Parameter]
public bool Multiple { get; set; }

Property Value

Type	Description
bool	true if multiple; otherwise, false.

Name

Gets or sets the name.

Declaration

[Parameter]
public string Name { get; set; }

Property Value

Type	Description
string	The name.

ParameterName

Gets or sets the parameter name. If not set 'file' parameter name will be used for single file and 'files' for multiple files.

Declaration

[Parameter]
public string ParameterName { get; set; }

Property Value

Type	Description
string	The parameter name.

Progress

Gets or sets the progress callback.

Declaration

[Parameter]
public EventCallback<UploadProgressArgs> Progress { get; set; }

Property Value

Type	Description
EventCallback<UploadProgressArgs>	The progress callback.

Url

Gets or sets the URL.

Declaration

[Parameter]
public string Url { get; set; }

Property Value

Type	Description
string	The URL.

Methods

BuildRenderTree(RenderTreeBuilder)

A file upload component with progress tracking, multiple file support, and drag-and-drop capability. RadzenUpload provides a full-featured file upload interface with automatic or manual upload, server communication, and comprehensive event handling. Handles file selection and upload to a server endpoint with automatic upload on file selection or manual triggering via Upload() method, real-time upload progress with percentage and bytes loaded, file type restriction via Accept property (MIME types or extensions), custom authentication or HTTP headers, Complete/Error/Progress/Change events for tracking upload lifecycle, automatic image preview for image files, file removal support, and built-in drag-and-drop for file selection. Uploads files to the URL endpoint via HTTP POST multipart/form-data. Server-side endpoint must accept file uploads and return appropriate responses.

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
RenderTreeBuilder	__builder

Overrides

ComponentBase.BuildRenderTree(RenderTreeBuilder)

ClearFiles()

Clear selected file(s) from the upload selection

Declaration

public Task ClearFiles()

Returns

Type	Description
Task

CreateUploadChangeEventArgs(IEnumerable<FileInfo>)

Creates the upload change event args.

Declaration

public UploadChangeEventArgs CreateUploadChangeEventArgs(IEnumerable<FileInfo> files)

Parameters

Type	Name	Description
IEnumerable<FileInfo>	files

Returns

Type	Description
UploadChangeEventArgs

GetComponentCssClass()

Gets the component CSS class.

Declaration

protected override string GetComponentCssClass()

Returns

Type	Description
string

Overrides

RadzenComponent.GetComponentCssClass()

GetHeaders()

Gets the headers.

Declaration

[JSInvokable("GetHeaders")]
public IDictionary<string, string> GetHeaders()

Returns

Type	Description
IDictionary<string, string>	IDictionary<System.String, System.String>.

OnAfterRenderAsync(bool)

Called by the Blazor runtime.

Declaration

protected override Task OnAfterRenderAsync(bool firstRender)

Parameters

Type	Name	Description
bool	firstRender

Returns

Type	Description
Task

Overrides

RadzenComponent.OnAfterRenderAsync(bool)

OnChange(IEnumerable<PreviewFileInfo>)

Called on file change.

Declaration

[JSInvokable("RadzenUpload.OnChange")]
public Task OnChange(IEnumerable<PreviewFileInfo> files)

Parameters

Type	Name	Description
IEnumerable<PreviewFileInfo>	files	The files.

Returns

Type	Description
Task

OnComplete(string, bool)

Called when upload is complete.

Declaration

[JSInvokable("RadzenUpload.OnComplete")]
public Task OnComplete(string response, bool cancelled)

Parameters

Type	Name	Description
string	response	The response.
bool	cancelled	Flag indicating if the upload was cancelled

Returns

Type	Description
Task

OnError(string)

Called on upload error.

Declaration

[JSInvokable("RadzenUpload.OnError")]
public Task OnError(string error)

Parameters

Type	Name	Description
string	error	The error.

Returns

Type	Description
Task

OnProgress(int, long, long, IEnumerable<FileInfo>, bool)

Called on progress.

Declaration

[JSInvokable("RadzenUpload.OnProgress")]
public Task<bool> OnProgress(int progress, long loaded, long total, IEnumerable<FileInfo> files, bool cancel)

Parameters

Type	Name	Description
int	progress	The progress.
long	loaded	The loaded.
long	total	The total.
IEnumerable<FileInfo>	files	The files.
bool	cancel	The cancelled state.

Returns

Type	Description
Task<bool>

OnRemove(PreviewFileInfo, bool)

Called on file remove.

Declaration

protected Task OnRemove(PreviewFileInfo file, bool fireChangeEvent = true)

Parameters

Type	Name	Description
PreviewFileInfo	file	The file.
bool	fireChangeEvent	If the linked Change event should be fired as a result of this removal (default: true)

Returns

Type	Description
Task

RemoveFile(string, bool)

Called on file remove.

Declaration

public Task RemoveFile(string fileName, bool ignoreCase = false)

Parameters

Type	Name	Description
string	fileName	The name of the file to remove.
bool	ignoreCase	Specify true is file name casing should be ignored (default: false)

Returns

Type	Description
Task

SetParametersAsync(ParameterView)

Called by the Blazor runtime when parameters are set.

Declaration

public override Task SetParametersAsync(ParameterView parameters)

Parameters

Type	Name	Description
ParameterView	parameters	The parameters.

Returns

Type	Description
Task

Overrides

RadzenComponent.SetParametersAsync(ParameterView)

Upload()

Uploads this instance selected files.

Declaration

public Task Upload()

Returns

Type	Description
Task

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable