Skip to main content Skip to footer

Hierarchical Grids: Assign an Array to childItemsPath Property

Wijmo's popular childItemsPath property now supports arrays, allowing you to display hierarchies where items at different levels have different types and properties to contain the child items.

About childItemsPath

The childItemsPath has long been a unique and very popular feature of the FlexGrid control. It allows developers to display hierarchical data as trees with collapsible nodes. For example, you could have a folder object with an items property that contains a list of child folder objects. To display this hierarchy in a FlexGrid, you could simply set the itemsSource property to a list of folders, and the childItemsPath property to “items”. This feature became really popular, and we started getting requests to make it more flexible so users could display hierarchies with more differences. For example, consider a list of worker objects. Each worker has a checks property with a list of check objects. Each check has an earnings property with a list of earning objects. You could show this tree in a FlexGrid control by assigning two properties:


flex.itemsSource = workers;  
flex.childItemsPath = ['checks', 'earnings'];  

Instead of setting the childItemsPath property to a string, we are setting it to an array that contains the name of the properties that contain child items at each level. This enables many scenarios that were fairly tricky to implement before, without breaking existing code or adding properties to the FlexGrid. In case you are curious, this is how the FlexGrid would display this data (workers and checks are represented by collapsible nodes, and earnings are regular rows): Hierarchical Grids and Folder Items Set the childItemsPath property to an array Expanded in version 5.20153.109

MESCIUS inc.

comments powered by Disqus