The “Detail Row” feature displays data row details on an expandable pane. The pane can be expanded and collapsed either programmatically or via the Grid’s UI.
The “Detail Row” feature requires the following plugins:
Note that the plugin order is important.
Add the required plugins listed above to the Grid and specify the detail row component via the DxTableRowDetail
plugin’s contentComponent
property to set up a simple Grid with detail rows.
Specify an array of the expanded row IDs using the DxRowDetailState
plugin’s expandedRowIds
property and subscribe to the update:expandedRowIds
event. Use the .sync
modifier for two-way binding.