UI for ASP.NET Core
ASP.NET Core ListBox
- Use the ASP.NET Core ListBox to enable multiple items selection, display, reorder and transfer of items.
- Part of the Telerik UI for ASP.NET Core library along with 110+ professionally designed UI components.
- Includes support, documentation, demos, virtual classrooms, Visual Studio Code Extensions and more!
-
Overview
The ListBox for ASP.NET Core is a helper that displays a list of items. It allows multiple selection of items, reorder and transfer between two listboxes. Drag and drop is fully supported as well.
Check out the Telerik UI for ASP.NET Core ListBox demo
-
Data Binding
By default, the ASP.NET Core ListBox automatically bounds to data, however, this can be easily disabled by setting the AutoBind option to false. The component can be bound to local arrays of data and to remote data sources.
-
Selection
The ListBox has a default single selection. In order to configure multiple selections you just need to add selectable: "multiple" to its settings. The selected items can be also reordered.
-
Connecting Multiple ListBox Widgets
You can connect the ListBox with another list-box and transfer items between them by dragging and dropping or through the Toolbar buttons.
-
Drag and Drop
Drag and Drop functionality is also provided out of the box. It can be used for transferring items between two ListBoxes or in case of a single ListBox it is used for reordering. The example below demonstrates how you could use the Drag & Drop.
Example of ASP.NET Core ListBox Drag and Drop feature
-
Item Templates
The ListBox supports the use of templates for its items that are passed as а function or a string.
-
Razor Pages
The ListBox is one of the many Telerik UI for ASP.NET Core controls that are supported in both MVC and Razor Pages applications. In the Razor Page scenario, you can set up the ListBox component bindings through configuring the CRUD (Create, Read, Update, Delete) methods of its DataSource instance. To learn more about plugging ASP.NET Core components in Razor Pages, check out the documentation article or visit the Razor Pages examples in our GitHub project repository. -
Accessibility
The ListBox component is perfect for scenarios where accessibility is important for your application. The ListBox complies with Section 508 and WCAG 2.1 guidelines, ensuring that individuals with disabilities can still view and interact with it.
-
Keyboard Navigation
The Telerik UI for ASP.NET Core ListBox component is one of the many in the suite with out-of-the-box keyboard navigation support. This allows users to easily navigate through the component.
See the supported keys and user actions in this demo
-
ListBox Theming
The Telerik UI for ASP.NET Core ListBox has 20+ built-in themes and swatches. Explore the Default (our own styling), Material (based on the Material Design guidelines), Bootstrap (which looks like the Bootstrap styling to integrate better) and Fluent (based on Microsoft Fluent UI) themes and choose the swatch that best suits your application. You can easily customize any theme with a few lines of CSS or create a new one to match your colors and branding with the Progress SASS ThemeBuilder application.
