Help / Developing an application or website / Controls, windows and pages / Controls: Available types / TreeView Table control
  • Overview of the TreeView Table control
  • How to?
  • Creating a TreeView Table control
  • Control characteristics
  • TreeView column
  • Handling the nodes of the tree structure through programming
  • Vocabulary
  • Swapping the Table/TreeView Table controls
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WindowsLinuxPHPWEBDEV - Browser code
AndroidAndroid Widget iPhone/iPadIOS WidgetApple WatchMac CatalystUniversal Windows 10 App
Stored procedures
Overview of the TreeView Table control
The TreeView Table control is a cross between the Table control and the TreeView control.
This control is based on the structure of a Table control (column, row, cell) but it also contains a TreeView column that introduces the notion of tree structure. This notion does not exist in a Table control.
The columns of a TreeView Table control and the columns of a Table control have the same characteristics.
A TreeView Table control allows you to perform a single selection or a multiple selection as well as a sort on the columns (sort by level, among sibling elements).
The information displayed in the TreeView Table control can:
  • be defined programmatically: this is referred to as TreeView Table control populated programmatically.
  • WEBDEV - Server code come from a data file or query : this is referred to as Browsing TreeView Table. Only the browsing TreeView Table controls loaded in memory are available. In this case, the control handles the records of the data file loaded in memory.
How to?

Creating a TreeView Table control

To create a TreeView Table control:
  1. On the "Creation" tab, in the "Data" group,
    • WEBDEV - Server code expand "Table" and select "TreeView Table". The TreeView Table control creation wizard starts. This wizard is used to:
      • select the data source for the TreeView Table control.
      • select the specific parameters of the TreeView Table control.
  2. Click where the control will be created in the window or page.
Remark: The dimensions of the control are optimized to take up the available space at the specified position. If the control size does not suit you, press Ctrl + Z: the control size will be reset to default.

Control characteristics

To view the characteristics of the control, select "Description" in the context menu. There are two types of information:
  • the information regarding the entire TreeView Table control (all you have to do is select the name of the control).
  • the information regarding each column of the TreeView Table control (all you have to do is select the name of a column).
Table and TreeView Table controls, as well as their columns, share most of their characteristics.
For more details on the characteristics of Table controls, see:
For more details on TreeView Table controls, see:

TreeView column

To choose the column that will display the hierarchy:
  1. Open the TreeView Table control description window.
  2. In the "General" tab, enter the number of the desired column in "Number of TreeView column".

Handling the nodes of the tree structure through programming

To modify the images of the treeview nodes in a TreeView Table control, use the following properties:
For more details on how to handle TreeView Table controls programmatically, see Handling TreeView Table controls programmatically.
To easily handle a TreeView Table control, you must be familiar with the following vocabulary:
Selection barUsed to view the selected element. A specific color is used in most cases.
BranchPart of the tree structure that can define a path:
  • from the root to a leaf,
  • from a node to another node,
  • from a node to a leaf,
  • from the root to a node.
ElementGeneric name corresponding to the content of a TreeView: Root, Node or Leaf are the elements of the tree structure of a TreeView Table
LeafLast element of the tree structure: there is no level below.
NodeIntermediate level, can have higher levels (also called "Parent" levels) and lower levels (also called "Child" levels).
Remark: the root and the leaves correspond to specific nodes.
RootFirst element in the tree structure of the TreeView Table. The entire tree structure can be expanded from this element.
Swapping the Table/TreeView Table controls
A Treeview Table control can be automatically transformed into a Table control and conversely:
  1. Select the TreeView Table control to transform.
  2. On the "Modification" tab, in the "Transformations" group, expand "Refactoring and swapping" and select "Table / TreeView Table".
Related Examples:
The TreeView Table control Unit examples (WINDEV): The TreeView Table control
[ + ] Using the "TreeView Table" control.
This control is used to organize the data found in a table in tree structure.
The user has the ability to see only the informations he is interesting it.
This example explains how to fill a treeview table, insert data, add child elements...
WD Reflexive link Training (WINDEV): WD Reflexive link
[ + ] This example presents the management of a reflexive link with the WLanguage functions.
The following topics are presented in this example:
1/ Fill a control with HFSQL content (automatic management of reflexive link).
2/ Fill by programming.
Drag and drop Unit examples (WINDEV): Drag and drop
[ + ] Using Drag & Drop with the WLanguage functions.
The following topics are presented in this example:
1/ How to manage Drag&Drop between WINDEV controls
2/ How to manage Drag&Drop from the Windows file explorer to a WINDEV control
Drag & Drop is used to move objects via the mouse. "Drag" consists in clicking an object and moving the mouse while keeping the left button down. "Drop" consists in releasing the left mouse button.
Drag & Drop can be used with WINDEV on the List Box, TreeView, Table and Image controls.
The Table/TreeView Table control (Progress Bar columns) Unit examples (WINDEV): The Table/TreeView Table control (Progress Bar columns)
[ + ] Using a Progress Bar column as well as the ..TextProgressBar property in a Table or TreeView Table control
Minimum version required
  • Version 11
This page is also available for…
Video TreeView Table Control

06 Apr. 2019
Video TreeView
15 Jul. 2018

Last update: 06/22/2023

Send a report | Local help