Unplanned
Last Updated: 27 Sep 2023 08:53 by Hannes
We need to set a custom hint conditionally in the file select/upload drop zone, is there a solution for that?
Planned
Last Updated: 20 Sep 2023 11:15 by ADMIN
Scheduled for 4.7.0 (22 Nov 2023) (R1 PI1)

Hello,

I'm trying to add image previewing to our .Net 6.0.8 Blazor Wasm app using the Telerik Blazor UI FileSelect component. I'd like to be able to create a local url for previewing and also hold onto the file's contents for saving later. There currently doesn't seem to be any great examples/references for doing this using the Telerik FileSelect locally. So, I started looking at the official MS Blazor documentation around images, file uploads and downloads - the most relevant content seemed to be around giving a file's stream to a DotNetStreamReference, then handing it off to JS interop to create a URL from a Blob.

It was already quite slow when testing with a 4KB~ image, but became absolutely unusable once testing things with a larger 4MB~ image. To rule out the Telerik FileSelect's involvement I started testing with the native Blazor FileInput component. I noticed that the sending the DotNetStreamReference to JS interop took a long time itself and learned that .Net 6 added the ability to pass a byte[] almost instantly to JS interop. I was then able to see image previews quickly using the native FileInput component while hosting a file from a byte[]. With this new knowledge in hand I attempted to migrate this new workflow over to the Blazor FileSelect component, but unfortunately there doesn't seem to be a faster way to get a byte[] from the FileSelectFileInfo's Stream.

I'm seeing similar performance issues between the native FileInput using a stream and the Telerik FileSelect using a stream or byte[]. These are both taking around 4-5 minutes to host a file with a locally generated url and preview the image. In contrast I'm seeing wait times around 3-12 seconds using the native FileInput/IBrowserFile, this

byte[] iBrowserFileBytes = new byte[iBrowserFile.Size];
await iBrowserFile.OpenReadStream(maxFileSize).ReadAsync(iBrowserFileBytes);

Please see the attached Blazor Wasm code to recreate the issue. I've included 6 file inputs to test out the difference in performance between each scenario, but the most important file input is the "Blazor InputFile - HostFromByteArray" which shows the most promise. Attached is also the larger file that I was testing against. This might be a bug or maybe I'm just not reading from the FileSelectFileInfo's Stream in the most efficient way.

The only relevant code not attached is likely just this one from Program.cs:

// ...
builder.Services.AddSingleton<IJSInProcessRuntime>(services => (IJSInProcessRuntime)services.GetRequiredService<IJSRuntime>());
// ...
Unplanned
Last Updated: 11 Aug 2023 06:05 by Shannon

Add a parameter to the FileSelect component that enables users to control the visibility of the file list.

https://docs.telerik.com/kendo-ui/api/javascript/ui/upload/configuration/showfilelist

 

Unplanned
Last Updated: 11 Jul 2023 10:28 by Twain

When the Multiple parameter is set to false, it should restrict the user to selecting only one file. However, the user can still select and upload multiple files if they are dragged.

 

To reproduce the problem open the following REPL and try to drag a few files in the FileSelect.
https://blazorrepl.telerik.com/QRaVFPFE26rIsb0C21

 

Declined
Last Updated: 29 May 2023 11:12 by ADMIN

Hi,

We have found a strange issue that I have created a REPL to reproduce: https://blazorrepl.telerik.com/cnupFJbS23F6HHJ006

1. Select a .doc file

2. Select a second file

3. Click the "Copy Memory Stream" Button

the method stops at CopyToAsync for the .doc file

It seems to work fine if the files are selected together or if different file types are used

I have been testing with the attached .doc and a blank .txt file

Completed
Last Updated: 24 Feb 2023 12:57 by ADMIN
Release 4.1.0 (15/03/2023)
Created by: David
Comments: 1
Category: FileSelect
Type: Feature Request
10
When using the FileSelect control in a modal popup, it would be great for using it multiple times to be able to clear selected files after the back end code is done working with them in a similar fashion to how the upload .ClearFiles() works.
Duplicated
Last Updated: 16 Jun 2022 06:52 by ADMIN
Created by: Benjamin
Comments: 2
Category: FileSelect
Type: Feature Request
6

Hey Telerik-Team,

unfortunatelly we're not able to set the button text for the file input. The <span> is empty and the component does not allow setting the caption:

Code:

HTML:

Output:

No ChildComponent seems to be allowed - when I manually modify the html and put something in the empty <span>, the text appears:

Unplanned
Last Updated: 11 Feb 2022 09:47 by ADMIN
Created by: Stewart
Comments: 1
Category: FileSelect
Type: Feature Request
6

I am using the TelerikFileSelect component and I noticed that the user can select the same file multiple times and it just adds to the list


I was wondering if it's possible to maybe add logic to the OnSelect event that prevents the file from being added to the list of files under certain conditions such as duplication.

---

ADMIN EDIT

---

This could be achieved through cancelling the OnSelect event based on the desired condition - for instance, duplicated file names.