This sample demonstrates how to export detail grids. In this sample, you can export the detail grid by clicking the corresponding export button on the grid's toolbar.
The detail row template provides additional information about a data row which can shown or hidden by clicking the
expand or collapse button. The
detailTemplate
property accepts either the string or HTML element`s ID value, which will be used as the
template for the detail row.
In this demo, Employees' information is displayed in the detail row.
Data Grid supports client-side exporting to export data to the Excel and PDF formats.
In this demo, the Employees' information can be exported using the exportDetailTemplate
event where each cell can be customized.
The ExcelExport and PdfExport items are defined in the toolbar of the Grid. Actions are defined in
the toolbarClick
event
to export Grid data using excelExport
and pdfExport
methods with the
hierarchyExportMode
set to All
.
The detail grids' export options can be changed by using the hierarchyExportMode
property.
The detail template allows you to export the grid with the following options,
Expanded
: Exports only the visible detail rows in an expanded state.All
: Exports all the detail rows in an expanded state.None
: Exports the detail rows in a collapsed state.Injecting Module
Grid features are segregated into individual feature-wise modules.
To use the detail template, PdfExport and ExcelExport Grid features, inject DetailRow
,
PdfExport
, ExcelExport
modules into the services
.
More information on the exporting configuration can be found in this Excel-export and PDF-export documentation sections.