Blazor FileSelect - Overview
- VIEW SOURCE
- EDIT IN TELERIK REPL
- Change Theme
The FileSelect component is part of Telerik UI for Blazor, a professional grade UI library with 100+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
The Telerik UI for Blazor FileSelect component allows users to select files from their local devices. It offers a rich event list to accommodate security information, application logic and file validation.
To use the Telerik FileSelect component in Blazor applications, you need to add the <TelerikFileSelect> tag, set the allowed extensions in the AllowedExtensions parameter to a List <string>, set the MaxFile size in bytes and implement the OnSelect event handler. In this demo, you can see a primary example of using a FileSelect component that limits the allowed file extensions to .DOCX, .PDF, .JPG, .PNG and the size to min = 1KB and max = 4MB. Please note that if you want to validate the files when uploading, you should implement the validation on both the client and server sides. The client validation is performed by the Telerik FileSelect component, while the server validation must be implemented in the application endpoints. Also, if you are developing Blazor Server apps, be informed that the FileSelect uses the SignalR WebSocket and large file support (> 32KB) requires MaximumReceiveMessageSize configuration.
The Telerik FileSelect for Blazor provides a Stream for each selected file, so that you can manipulate the file in-memory, save it to the file system or send it to another destination. The component exposes OnSelect and OnRemove events that fire when one or multiple files have been selected/de-selected. Furthermore, you can take advantage of the multiple properties within the FileSelectFileInfo class to pass their values in the FileSelectEventArgs event argument.