Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

File Input #1528

Closed
0xor1 opened this issue May 24, 2024 · 3 comments
Closed

File Input #1528

0xor1 opened this issue May 24, 2024 · 3 comments

Comments

@0xor1
Copy link

0xor1 commented 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.

@akorchev
Copy link
Collaborator

Check RadzenFileUpload. It supports that already.

@0xor1
Copy link
Author

0xor1 commented 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}");
    }
}

@akorchev
Copy link
Collaborator

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants