[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Rich Text Editor
  [Collapse]Tree List
   [Collapse]Getting Started
     Lesson 1 - Binding to Data
     Lesson 2 - Building a Tree in Unbound Mode
   [Expand]Design-Time Features
   [Expand]End-User Capabilities
  [Expand]Gauge Controls
  [Expand]Map Control
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Lesson 1 - Binding to Data

This tutorial demonstrates how to add a TreeListControl to your project and bind the control to your data source.

Expanded Add a Data Model

The TreeList control cannot operate without a data source. It can be bound to data from a database, from an XML file or to any data created at runtime. The TreeList control can be bound to any object that implements the System.Collections.IEnumerable interface or its descendant (e.g., IList, ICollection). To bind a tree list, assign a data source to the ItemsSource property.

To build a tree, data source objects must contain the following fields.

  • Key Field: This field must contain unique values used to identify nodes.
  • Parent Field: This field must contain values that indicate parent nodes.

The code sample below demonstrates a simple data model (the Employee class) that is used in this tutorial.

Model code:

Expanded Add a ViewModel

Create a ViewModel class that will expose the Employees field of the List<Employee> type.

ViewModel code:

Build the solution. Invoke the main window smart tag and define its data context like it is shown in the image below.

Expanded Add TreeListControl to the View

Add the TreeListControl to the main window of your project.

To do this, open the Visual Studio toolbox, find the DX.18.2: Data & Analytics tab, and drag the TreeListControl toolbox item to the window.

Right-click the TreeListControl and select Layout - Reset All to fill the entire window.

The following code will be generated.

To bind the tree list to data, invoke the TreeListControl's smart tag, and define the ItemsSource field like it is shown in the image below.

Use the TreeListView.KeyFieldName and TreeListView.ParentFieldName properties to specify the service columns like it is shown in the sample below.

Expanded Get the Result

Run the solution. The image below demonstrates the result.

Expanded See Also

Is this topic helpful?​​​​​​​