• Material 3
  • Material 3 Dark
  • Fluent
  • Fluent Dark
  • Bootstrap v5
  • Bootstrap v5 Dark
  • Tailwind CSS
  • Tailwind CSS Dark
  • Material
  • Bootstrap v4
  • High Contrast
Preferences
Theme Selection
Mode Selection
Touch
Mouse
Localization
*Translated by Google Translator.
Currency

Example of Detail Template Exporting in ASP.NET MVC Data Grid Control

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.

DEMO
SOURCE

The detail row template provides additional information about a data row which can be 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.

More information on the exporting configuration can be found in this Excel-export and PDF-export documentation sections.