Example of Hierarchy Grid in React Grid Component


This sample demonstrates the hierarchical binding of the Grid component. Click the expand button to view the child Grid of a particular record.

More Details...


The Hierarchy Grid is used to display table data in hierarchical structure which can show or hide by clicking on expand or collapse button. This feature can be enabled by defining childGrid and childGrid.queryString. And the detailDataBound event triggers at initial expand of every child Grid.

In this demo, three level hierarchy is demonstrated with hierarchical structure Employee -> Orders -> Customers.

Injecting Module:

Grid features are segregated into individual feature-wise modules. To use Hierarchy Grid feature, we need to inject DetailRow using the Grid.Inject(DetailRow) section.