diff --git a/concepts/05 UI Components/TreeList/02 Overview/00 Overview.md b/concepts/05 UI Components/TreeList/02 Overview/00 Overview.md new file mode 100644 index 0000000000..3792e25599 --- /dev/null +++ b/concepts/05 UI Components/TreeList/02 Overview/00 Overview.md @@ -0,0 +1,3 @@ +DevExtreme TreeList is a UI component for displaying hierarchical data in a grid. It can handle a collection of linked plain objects and build a tree hierarchy. Key features include data editing and validation, sorting, filtering, searching, and adaptability. + +In this overview, you can find a map of TreeList elements, information about key features, and what to explore next. \ No newline at end of file diff --git a/concepts/05 UI Components/TreeList/02 Overview/05 Elements.md b/concepts/05 UI Components/TreeList/02 Overview/05 Elements.md new file mode 100644 index 0000000000..9ada5a1d4a --- /dev/null +++ b/concepts/05 UI Components/TreeList/02 Overview/05 Elements.md @@ -0,0 +1,14 @@ +Click an element in the map below to navigate to the topic related to that element. + +

TreeList elements + + + Toolbar items + Column chooser + Search panel + Row reordering + Expand  and collapse rows + Filter row + Editing + Pager +

\ No newline at end of file diff --git a/concepts/05 UI Components/TreeList/02 Overview/10 Key Features.md b/concepts/05 UI Components/TreeList/02 Overview/10 Key Features.md new file mode 100644 index 0000000000..93374672ea --- /dev/null +++ b/concepts/05 UI Components/TreeList/02 Overview/10 Key Features.md @@ -0,0 +1,14 @@ +- **Data Binding** +TreeList can load and update data from different [data source](/Documentation/ApiReference/UI_Components/dxTreeList/Configuration/#dataSource) types. You can define data as [plain or hierarchical](/Documentation/ApiReference/UI_Components/dxTreeList/Configuration/#dataStructure). If you choose plain data, you can load it [on demand](/Documentation/ApiReference/UI_Components/dxTreeList/Configuration/#hasItemsExpr). + +- **Various Edit Modes** +[Edit](/concepts/05%20UI%20Components/TreeList/20%20Editing '/Documentation/Guide/UI_Components/TreeList/Editing/') TreeList data in multiple modes, including [form](/concepts/05%20UI%20Components/TreeList/20%20Editing/10%20User%20Interaction/40%20Form%20Mode.md '/Documentation/Guide/UI_Components/TreeList/Editing/#User_Interaction/Form_Mode') and [popup](/concepts/05%20UI%20Components/TreeList/20%20Editing/10%20User%20Interaction/50%20Popup%20Mode.md '/Documentation/Guide/UI_Components/TreeList/Editing/#User_Interaction/Popup_Mode') modes. + +- **Filtering and Sorting** +Set up a [filter row](/concepts/05%20UI%20Components/TreeList/30%20Filtering%20and%20Searching/1%20Filter%20Row.md '/Documentation/Guide/UI_Components/TreeList/Filtering_and_Searching/#Filter_Row') and a [header filter](/concepts/05%20UI%20Components/TreeList/30%20Filtering%20and%20Searching/2%20Header%20Filter.md '/Documentation/Guide/UI_Components/TreeList/Filtering_and_Searching/#Header_Filter') to filter data by column values, or use other [ways to filter](/concepts/05%20UI%20Components/TreeList/30%20Filtering%20and%20Searching '/Documentation/Guide/UI_Components/TreeList/Filtering_and_Searching/'). You can [sort](/concepts/05%20UI%20Components/TreeList/25%20Sorting/10%20User%20Interaction.md '/Documentation/Guide/UI_Components/TreeList/Sorting/#User_Interaction') TreeList by single or multiple columns initially or at runtime. + +- **Rich Customization** +TreeList offers extensive appearance and behavior customization. + +- **Nodes Drag and Drop** +You can [drag and drop](/Documentation/Guide/UI_Components/TreeList/Getting_Started_with_TreeList/#Enable_Row_Drag_&_Drop) nodes to reorder them or change their hierarchy. \ No newline at end of file diff --git a/concepts/05 UI Components/TreeList/02 Overview/15 Explore More.md b/concepts/05 UI Components/TreeList/02 Overview/15 Explore More.md new file mode 100644 index 0000000000..100dcfbc96 --- /dev/null +++ b/concepts/05 UI Components/TreeList/02 Overview/15 Explore More.md @@ -0,0 +1,5 @@ +- [Getting Started with TreeList](/concepts/05%20UI%20Components/TreeList/00%20Getting%20Started%20with%20TreeList '/Documentation/Guide/UI_Components/TreeList/Getting_Started_with_TreeList/') + +- [API](/api-reference/10%20UI%20Components/dxTreeList '/Documentation/ApiReference/UI_Components/dxTreeList/') + +- [Demos](/concepts/05%20UI%20Components/TreeList/Demos.md '/Documentation/Guide/UI_Components/TreeList/Demos/') \ No newline at end of file diff --git a/images/treelist/tree-list-elements.png b/images/treelist/tree-list-elements.png new file mode 100644 index 0000000000..bf200a074d Binary files /dev/null and b/images/treelist/tree-list-elements.png differ