Hierarchical data is very common when working with databases, but showing such data can pose challenges when you want to show all the data on one page. In the past I showed how to show hierarchy using a tree component, in this blog I’m building on top of the concepts shown there to create a UI representations that shows a nested details table for each master record.
In the example we use a data set of departments and employees that belong to each one of them. We want to show a table of the employees below the details of each department. This is a common representation in “report” type of outputs.
To achieve this we are starting from the tree example, populating an ArrayTreeDataProvider with the data.
We then use an oj-bind-for-each component to dynamically render each of the master records. Binding the component to the array of master records, and using a panel with content in it bound to a specific field. You can of course expand and modify the layout of that area with additional fields and layouts. Read the complete article here.
For regular information become a member in the Developer Partner Community please register here.