Radzen Blazor Components

ListBox

Demonstration and configuration of the Radzen Blazor ListBox component.

These demos showcase a list selection component with two-way data binding, customizable text/value properties, item templates, multiple selection support, filtering with configurable case sensitivity and operators, custom filtering via LoadData event, and virtualization using IQueryable or LoadData for large datasets.

Get and Set the value of ListBox link

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.

Get and Set the value of ListBox using Value and Change event link

Value property can be used to set the value of the component and Change event to get the user input.

Define Text and Value properties link

Use the TextProperty and ValueProperty properties to specify which fields to display and use as values.

ListBox with template link

Use the Template property to customize how items are displayed in the list box.

ListBox multiple selection link

Use Multiple="true" to enable selection of multiple items in the list box.

    Filtering case sensitivity and filter operator link

    Configure filtering behavior with FilterCaseSensitivity and FilterOperator properties.

    Custom filtering with LoadData event link

    Use the LoadData event to implement custom filtering logic and load data on-demand.

    ListBox virtualization using IQueryablelink

    Enable virtualization with IQueryable to efficiently handle large datasets by loading items on demand.

    ListBox virtualization with LoadData event link

    Combine virtualization with the LoadData event for custom data loading with large datasets.

    Keyboard Navigation link

    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 Expand or collapse the Fieldset.
    DownArrow Focus the next ListBox item.
    UpArrow Focus the previous ListBox item.
    Enter Select the focused ListBox item.
    Alphanumeric Focus next ListBox item starting with typed key.
    All the tools in one place

    Save Hours on Every Project

    With Radzen Blazor subscription you get the full toolkit, including:

    support

    Dedicated support backed by proven expertise

    palette

    Premium themes and theme editor

    widgets

    Ready-to-use UI blocks

    dashboard_customize

    Complete app templates

    format_shapes

    Visual design-time-experience

    Radzen Blazor Studio

    Radzen Blazor Components, © 2018-2025 Radzen.
    Source Code licensed under MIT

    Demos Configuration

    Premium Themes

    • Material 3
    • Material 3 Dark
    • Fluent
    • Fluent Dark

    Free Themes

    • Material
    • Material Dark
    • Standard
    • Standard Dark
    • Default
    • Dark
    • Humanistic
    • Humanistic Dark
    • Software
    • Software Dark
    An error has occurred. This app may no longer respond until reloaded. Reload 🗙