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.
Inherited Members
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" Change=@OnChange Complete=@OnComplete />
@code {
void OnChange(UploadChangeEventArgs args)
=> Console.WriteLine($"Selected {args.Files?.Count() ?? 0} files");
void OnComplete(UploadCompleteEventArgs args)
=> Console.WriteLine(args.Cancelled ? "Upload cancelled" : "Upload complete");
}
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" Change=@OnChange Complete=@OnComplete />
@code {
void OnChange(UploadChangeEventArgs args)
=> Console.WriteLine($"Selected {args.Files?.Count() ?? 0} files");
void OnComplete(UploadCompleteEventArgs args)
=> Console.WriteLine(args.Cancelled ? "Upload cancelled" : "Upload complete");
}
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 |
|
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 |
|
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 |
|
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. |
Method
Specifies the HTTP method used for uploading files to the defined Url endpoint.
Common values are POST (default) and PUT.
If the Url parameter is not set, this property is ignored.
Defaults to POST.
Declaration
[Parameter]
public string Method { get; set; }
Property Value
| Type | Description |
|---|---|
| string | The HTTP method for file upload requests. |
Multiple
Gets or sets a value indicating whether this RadzenUpload is multiple.
Declaration
[Parameter]
public bool Multiple { get; set; }
Property Value
| Type | Description |
|---|---|
| bool |
|
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. |
Stream
Enables streaming upload mode for large files to the specified Url.
When true, files are uploaded as raw binary streams instead of multipart/form-data.
Only a single file can be uploaded at a time in streaming mode.
When false (default), files are uploaded as multipart/form-data (standard form upload),
and multiple files can be uploaded simultaneously if Multiple is enabled.
This property is ignored if Url is not set.
Declaration
[Parameter]
public bool Stream { get; set; }
Property Value
| Type | Description |
|---|---|
| bool |
|
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
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
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
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
Upload()
Uploads this instance selected files.
Declaration
public Task Upload()
Returns
| Type | Description |
|---|---|
| Task |