Telerik UI for ASP.NET Core TreeView Overview
- EXAMPLE
- VIEW SOURCE
-
Change Theme
defaultDefault Theme
- Main
- Main Dark
- Nordic
- Ocean Blue
- Ocean Blue A11Y
- Purple
- Turquoise
Bootstrap Theme- Main
- Bootstrap 3
- Bootstrap 3 Dark
- Main Dark
- Nordic
- Turquoise
- Turquoise Dark
- Urban
- Vintage
Material Theme- Main
- Arctic
- Lime Dark
- Main Dark
- Nova
Classic Theme- Main
- Green
- Green Dark
- Lavender
- Lavender Dark
- Main Dark
- Metro
- Metro Dark
- Moonlight
- Opal
- Opal Dark
- Silver
- Silver Dark
- Uniform
Fluent Theme- Main
Also available for:
CLIENT-SIDE API SERVER-SIDE APIThe TreeView component is part of Telerik UI for ASP.NET Core, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
Description
The Telerik UI for ASP.NET Core TreeView represents hierarchical data in a tree structure. It enables the users to navigate across the application pages, perform a single or multiple selections of items, and drag and drop elements within the TreeView or between multiple TreeView components. The TreeView offers built-in checkbox support, keyboard navigation, and RTL support, and provides templates for complete customization of each node. You can bind the TreeView to various data sources, take advantage of its load on demand feature, and request data only when a node is expanded.
As an expandable component, the TreeView supports >animation effects when the nodes are expanded or collapsed through user interactions.
The current demo shows two TreeViews with three levels of hierarchy. Their nodes can be selected, checked, or dragged and dropped between different parents in the same Treeview or between both component instances. The default items content is customized through a shared Kendo UI Template.
The ASP.NET Core TreeView control is part of Telerik UI for ASP.NET Core, a professional-grade UI library with 110+ components for building modern and feature-rich web applications. The TreeView is a server-side wrapper for the Kendo UI for jQuery TreeView component and supports an HtmlHelper and a TagHelper mode.
Functionality and Features
- Data binding—Declare all TreeView nodes within the helper declaration or use remote or local data binding.
- Items—Apply a variety of properties to the TreeView nodes.
- Dragging and dropping—Drag and drop the nodes of the TreeView across all levels.
- Checkboxes—Enable the checkbox functionality of the TreeView to facilitate user interaction.
- Templates—Customize the layout of the TreeView nodes.
- Events—Subscribe to the TreeView events to implement any custom logic when a specified item is selected, expanded, collapsed, or else.
- API functions—Take advantage of the available client-side API methods of the TreeView component.
- Accessibility and keyboard navigation—The TreeView is accessible for screen readers, supports WAI-ARIA attributes, and delivers keyboard shortcuts for faster navigation.
- RTL support—The TreeView component also enables you to render it in a right-to-left direction.