The Blazor ListBox shows a selectable list for single or multiple selection, with filtering and virtualization for large data.
As all Radzen Blazor input components the ListBox has a Value property which gets and sets the value of the component. Use @bind-Value to get the user input.
Value property can be used to set the value of the component and Change event to get the user input.
Use the TextProperty and ValueProperty properties to specify which fields to display and use as values.
Use the Template property to customize how items are displayed in the list box.
Use Multiple="true" to enable selection of multiple items in the list box.
Configure filtering behavior with FilterCaseSensitivity and FilterOperator properties.
Use the LoadData event to implement custom filtering logic and load data on-demand.
Use LoadingTemplate together with the IsLoading property to show a loading indicator while data is being fetched. LoadingTemplate takes precedence over the items and the empty message.
The list loads its data with a simulated delay; filtering reloads it and shows the loading state again.
Enable virtualization with IQueryable to efficiently handle large datasets by loading items on demand.
Combine virtualization with the LoadData event for custom data loading with large datasets.
The following keys or key combinations provide a way for users to navigate and interact with Radzen Blazor ListBox component.
| Press this key | To do this |
|---|---|
| Tab | Navigate to a ListBox component. |
| Space or Enter | Select the focused ListBox item. In multiple selection mode the selection of the focused item is toggled. |
| DownArrow / RightArrow | Focus the next ListBox item. In single selection mode the item is also selected. |
| UpArrow / LeftArrow | Focus the previous ListBox item. In single selection mode the item is also selected. |
| Home | Focus the first ListBox item. In single selection mode the item is also selected. |
| End | Focus the last ListBox item. In single selection mode the item is also selected. |
| Delete | Clear the selection when AllowClear is enabled. In multiple selection mode all selected items are cleared. |
| Alphanumeric | Focus next ListBox item starting with typed key. |
Set Multiple to true and bind Value to a collection so users can select several items.
Yes. Enable AllowFiltering for a search box and turn on virtualization to render large lists efficiently.
Radzen Blazor Components, © 2018-2026 Radzen.
Source Code licensed under
MIT
On this page