background

UI for ASP.NET Core

ASP.NET Core TreeView

  • Use the ASP.NET Core TreeView component to visualize hierarchical data in a tree-like structure.
  • 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!
Telerik UI for ASP.NET Core TreeView - Header
  • Display Data in a Tree-Like Structure

    The Telerik UI for ASP.NET Core TreeView component lets you display hierarchical data in a tree structure. It allows single or multiple item selection, drag and drop of elements within the component and comes with built-in checkbox support, keyboard navigation, RTL support and templates for complete customization. You can bind the TreeView to various data sources and utilize its load on demand feature.  

    See the ASP.NET Core TreeView in action
    Telerik UI for ASP.NET Core TreeView - Overview
  • Data Binding

    The TreeView can be bound in two ways: 

    • Locally on the server by passing the appropriate collection to the BindTo() method.
    • Remotely by using a DataSource configuration object.
    Telerik UI for ASP.NET Core Data Binding
  • Images and Sprites

    For a more intuitive user experience, the TreeView component allows you to add images or sprites in front of each item in the TreeView hierarchy. This lets you customize the look of the control to fit your customer’s design requirements.  
    Telerik UI for ASP.NET Core TreeView - Images
  • Animation Effects

    Couple of animation effects can be applied to the component. You can choose to enable either the Toggle or Expand animation.  

    Explore the ASP.NET Core TreeView Animation Effects
  • Checkboxes

    The built-in checkbox support enables your TreeView nodes to come with their own checkbox elements to indicate selection—without the need to create a customized template. You can define the Checkboxes configuration option by either using a Boolean value or by using inner (detailed) configuration options.  

    Check out the documentation on Checkbox configuration options 
    Telerik UI for ASP.NET Core TreeView - Checkboxes
  • Events

    There are multiple exposed TreeView events that let you control the programming logic for all interactions related to the TreeView, including selection, expanding, collapsing, loading, dragging and more. 

    Telerik UI for ASP.NET Core Events
  • Drag and Drop

    The component comes with a drag and drop feature that can be enabled by setting the DragAndDrop parameter to true. This allows users to easily drag and drop items within the TreeView, changing their position in the hierarchy. Users can also drag and drop items between different TreeView components. 
    Telerik UI for ASP.NET Core TreeView - Dragging
  • Templates

    Completely redefine the look and feel of a standard TreeView node with custom templates. You can provide a unique appearance for each node, giving you full control of your interface. 
  • Server- and Client-Side API for Extra Flexibility

    Telerik UI for ASP.NET Core comes with a complete server-side API. With simple API calls, you can configure all features of the ASP.NET Core TreeView. Since the server wrappers output the JavaScript, you also have full access to the client-side API for maximum control in the browser. 

  • RTL Support

    Right-to-left support is available for language scripts like Hebrew and Arabic, in which users read from right to left. You can satisfy any cultural preference with the TreeView component by toggling between left-to-right and right-to-left alignment with only a few settings. 
  • Load on Demand

    Load the TreeView data only as it is needed and not all at once. Thanks to the lazy loading feature, you can increase performance by configuring child nodes to get loaded on demand only when a parent node is expanded. 
  • Accessibility

    Rest assured that the Telerik ASP.NET Core TreeView is compliant with Section 508 and WCAG guidelines—perfect for scenarios where accessibility is a large concern.
    Accessibility
  • Keyboard Navigation

    As many other components in the Telerik UI for ASP.NET Core suite, the TreeView features out-of-the-box support for keyboard navigation. Users can press the arrows to navigate through the component, highlighting different items, and use the enter button to select the highlighted item. For a full list of supported keys and user actions, visit this demo.  

    Explore all supported keys and user actions in the TreeView Keyboard Navigation demo
    Keyboard navigation
  • TreeView Theming

    The ASP.NET Core TreeView has several built-in themes, such as Material (based on the Material Design guidelines), Bootstrap, Default (our own style) and Fluent. 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, using the Progress ThemeBuilder application. 

     

  • Also Available...

    The TreeView component is also available for these popular Web frameworks:

Frequently Asked Questions

  • Why should I work with Telerik UI for ASP.NET Core TreeView?
    • The Telerik UI for ASP.NET Core TreeView provides a tree-like structure for displaying hierarchical data and allows single or multiple item selection, drag and drop of elements and built-in checkbox support. 
    • Just like any ASP.NET Core component, the TreeView is highly accessible, responsive, and customizable allowing you to deliver engaging and consistent UI experience.   
    • The 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.   
    • The ASP.NET Core TreeView is frequently updated to ensure compatibility and cover user demands. If you see something missing, simply request it in the Telerik UI for ASP.NET Core Feedback portal.
    • With Telerik UI for ASP.NET Core you get access to a fast-responding support team on standby with 97% satisfaction rates.
    • Each feature of the TreeView is meticulously documented and visualized by a demo.  
  • Is there an option to try the Telerik UI for ASP.NET Core TreeView?

    Yes, of course! You can try each Telerik UI for ASP.NET Core component without paying anything or having to provide any payment details by simply signing for the free 30-day trial. During the evaluation, you will have access to all ASP.NET Core components, technical support, demos, documentation, and on-demand technical training.

  • What are some of the most typical use cases for the Telerik UI for ASP.NET Core TreeView?

    In general, the ASP.NET Core TreeView is used for drill-down navigation. If you supply a local or remote hierarchical data and the Telerik UI for ASP.NET Core TreeView component will render collapsible parent and child items. After that you can use them to help users navigate through information or web pages.

  • How can I buy the Telerik UI for ASP.NET Core TreeView?

    The TreeView is part of Telerik UI for ASP.NET Core, a professional grade UI library with 110+ components for building engaging, consistent, and feature-rich applications. You can buy the suite online or contact our sales team.

    You can, of course, decide to purchase a DevCraft license. It bundles all Progress Telerik .NET and JavaScript UI components.

  • How do I get started with the Telerik UI for ASP.NET Core TreeView?

    Getting started with any of the Telerik UI for ASP.NET Core components is easy. As a first step we recommend signing up for a trial (or purchase a license if you wish) and then check the extensive TreeView getting started documentation. You can also play with the available demos and explore the source code behind each of the examples.

  • Does Telerik UI for ASP.NET Core UI library have any other tree-like structure components?

    Yes, there are several components in our UI for ASP.NET Core library that allows you to build a tree-like experience, each covering different use cases. Check them out: 

All ASP.NET Core Components

Next Steps