File Input #1245

New Issue

claunia · 2026-01-29T17:51:00Z

claunia commented

2026-01-29 17:51:00 +00:00

Originally created by @0xor1 on GitHub (May 24, 2024).

The existing file input seems to restrictive in its usage. It would be nice to have a more basic version that simply returns a list of IBrowserFile OnChange, and lets you do what you need to do with it, rather than giving you back just the name and base64 string.

Originally created by @0xor1 on GitHub (May 24, 2024). The existing file input seems to restrictive in its usage. It would be nice to have a more basic version that simply returns a list of IBrowserFile OnChange, and lets you do what you need to do with it, rather than giving you back just the name and base64 string.

claunia closed this issue

2026-01-29 17:51:00 +00:00

claunia commented

2026-01-29 17:51:00 +00:00

@akorchev commented on GitHub (May 24, 2024):

Check RadzenFileUpload. It supports that already.

@akorchev commented on GitHub (May 24, 2024): Check RadzenFileUpload. It supports that already.

claunia commented

2026-01-29 17:51:01 +00:00

@0xor1 commented on GitHub (May 24, 2024):

maybe I'm missing something super obvious but the existing one only seems to support a single file and requires binding individual properties for file name and file size:

        /// <summary>
        /// Gets or sets the image file name.
        /// </summary>
        /// <value>The image file name.</value>
        [Parameter]
        public string FileName { get; set; }

        /// <summary>
        /// Gets or sets the FileName changed.
        /// </summary>
        /// <value>The FileName changed.</value>
        [Parameter]
        public EventCallback<string> FileNameChanged { get; set; }

        /// <summary>
        /// Gets or sets the image file size.
        /// </summary>
        /// <value>The image file size.</value>
        [Parameter]
        public long? FileSize { get; set; }

        /// <summary>
        /// Gets or sets the FileSize changed.
        /// </summary>
        /// <value>The FileSize changed.</value>
        [Parameter]
        public EventCallback<long?> FileSizeChanged { get; set; }

wouldn't it be more flexible and generic to have the value as List<IBrowserFile> Value and enable support to toggle multiple file selection? the existing implementation seems to be pretty hardcoded to a single file I've tried this in the examples on the docs page and it doesn't pick up the multiple selected files when I try:

@using RadzenBlazorDemos.Data
@using RadzenBlazorDemos.Models.Northwind

@inherits DbContextPage

<div class="container-fluid">
    <div class="row px-3">
        <div class="col-lg-6 offset-lg-3 p-3">
            <RadzenCard>
            <RadzenFileInput @bind-Value=@files TValue="List<IBrowserFile>" class="w-100" 
                Change=@OnChange Error=@(args => OnError(args, "FileInput")) InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "select file" }, { "multiple", true }})"/>
            </RadzenCard>
        </div>
    </div>
</div>

<EventConsole @ref=@console />

@code {
    List<IBrowserFile> files = new ();
    EventConsole console;

    string fileName;
    long? fileSize;

    void OnChange(List<IBrowserFile> value)
    {
        console.Log($"value: {value?.ToString()} files: {files?.ToString()}");
        console.Log($"value: {value?.Count} files: {files?.Count}");
    }

    void OnError(UploadErrorEventArgs args, string name)
    {
        console.Log($"{args.Message}");
    }
}

@0xor1 commented on GitHub (May 24, 2024): maybe I'm missing something super obvious but the existing one only seems to support a single file and requires binding individual properties for file name and file size: ```csharp /// <summary> /// Gets or sets the image file name. /// </summary> /// <value>The image file name.</value> [Parameter] public string FileName { get; set; } /// <summary> /// Gets or sets the FileName changed. /// </summary> /// <value>The FileName changed.</value> [Parameter] public EventCallback<string> FileNameChanged { get; set; } /// <summary> /// Gets or sets the image file size. /// </summary> /// <value>The image file size.</value> [Parameter] public long? FileSize { get; set; } /// <summary> /// Gets or sets the FileSize changed. /// </summary> /// <value>The FileSize changed.</value> [Parameter] public EventCallback<long?> FileSizeChanged { get; set; } ``` wouldn't it be more flexible and generic to have the value as `List<IBrowserFile> Value` and enable support to toggle multiple file selection? the existing implementation seems to be pretty hardcoded to a single file I've tried this in the examples on the docs page and it doesn't pick up the multiple selected files when I try: ```csharp @using RadzenBlazorDemos.Data @using RadzenBlazorDemos.Models.Northwind @inherits DbContextPage <div class="container-fluid"> <div class="row px-3"> <div class="col-lg-6 offset-lg-3 p-3"> <RadzenCard> <RadzenFileInput @bind-Value=@files TValue="List<IBrowserFile>" class="w-100" Change=@OnChange Error=@(args => OnError(args, "FileInput")) InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "select file" }, { "multiple", true }})"/> </RadzenCard> </div> </div> </div> <EventConsole @ref=@console /> @code { List<IBrowserFile> files = new (); EventConsole console; string fileName; long? fileSize; void OnChange(List<IBrowserFile> value) { console.Log($"value: {value?.ToString()} files: {files?.ToString()}"); console.Log($"value: {value?.Count} files: {files?.Count}"); } void OnError(UploadErrorEventArgs args, string name) { console.Log($"{args.Message}"); } } ```

claunia commented

2026-01-29 17:51:01 +00:00

@akorchev commented on GitHub (May 24, 2024):

Check the online demos for RadzenFileUpload (the client-side upload).

@akorchev commented on GitHub (May 24, 2024): Check the [online demos](https://blazor.radzen.com/example-upload) for RadzenFileUpload (the client-side upload).

claunia referenced this issue

2026-01-29 18:19:41 +00:00

[PR #1245] [MERGED] Numeric Issue with Leading Zeros #2622

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/radzen-blazor#1245