Progress Telerik UI for Blazor

Blazor FileSelect

  • The FileSelect component allows users to select local files and store them on a server. It exposes multiple configuration options for management of selected files and the way they are uploaded, disabled state, minimum and maximum file size, file types, and extensions. 
  • This component is part of the largest truly native Blazor component suite - Telerik UI for Blazor designed to perfectly fit in any app’s requirement.
  • The Blazor UI suite also comes with professionally designed themes enabled with a flip of a switch, document processing library, rich docs & demos to help you get started in no time.
Telerik UI for Blazor Suite
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Overview

    The UI for Blazor FileSelect component allows you to select local files and store them on a server. It exposes multiple configuration options that allow you to have full control over the management of selected files and the way they are uploaded, including disabled state, minimum and maximum file size, file types and extensions. It has built-in keyboard navigation support and accessibility, just like the rest of the Blazor UI components in the Telerik portfolio.

    See the Telerik UI for Blazor FileSelect features in action.
    Telerik UI for Blazor FileSelect Component
  • FileSelect Configuration Options

    The FileSelect can be configured to allow selecting single or multiple files at once via the Multiple parameter. For cases when you need to restrict users from selecting files, the FileSelect can be disabled through a single configuration option.


    Telerik UI for Blazor FileSelect Disabled State
  • FileSelect Validation

    Validation in the component is performed only client-side and is controlled by several parameters: AllowedExtensionsMinFileSize and MaxFileSize.

    See Blazor FileSelect validation examples.
    Telerik UI for Blazor FileSelect Validation
  • FileSelect Events

    The FileSelect component gives you programmatic control over the selected and removed files by exposing the following events:

    • OnSelect – Fired when a file or files have been selected through the Select files button.
    • OnRemove – Fired when a file has been removed from the list of selected files (by clicking the x icon or pressing Del key).
    See the FileSelect events demo.
    Telerik UI for ASP.NET Core Events
  • FileSelect Component Localization

    The FileSelect UI component has built-in localization support, which makes it easy to translate texts to any language that your Blazor app may require.

    globalization-localization
  • Keyboard Navigation & Accessibility

    Like all other Telerik UI for Blazor components, the FileSelect component supports out-of-the-box keyboard navigation and has been built with accessibility in mind. Using the Tab (for focus), Enter (open a selected file), Up/Down arrows (highlighting a selected file) and Delete (removes a highlighted file), you can work with the FileSelect without a touch of a mouse.

    Telerik UI for Blazor Keyboard Navigation and Accessibility
  • Theming

    The Telerik UI for Blazor FileSelect has several built-in themes such as Default (our own styling), Material (based on the Material Design guidelines) and Bootstrap (which looks like the Bootstrap styling to integrate better). You can easily customize any of the out-of-the-box themes with a few lines of CSS, or create a new theme to match your colors and branding by using the Telerik Sass ThemeBuilder application.

    Telerik UI for Blazor FileSelect Theming

All Blazor Components

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.