Angular Data Grid Excel Export
Export your Grid data to professional Excel reports with full control over formatting, styling, and content.
The Grid lets you create formatted workbooks with custom columns, styled cells, and computed fields. Export all data or just what's visible, apply currency and date formatting, and customize every aspect of the generated document.
Getting Started
Import the KENDO_GRID_EXCEL_EXPORT utility array and nest the kendo-grid-excel component inside kendo-grid tags.
Trigger the export using the kendoGridExcelCommand directive, kendoGridExcelTool toolbar tool, or saveAsExcel method.
<kendo-grid>
<kendo-grid-column></kendo-grid-column>
...
<kendo-grid-excel></kendo-grid-excel>
</kendo-grid>The following example demonstrates the Excel export functionality of the Grid.
Controlling the Exported Data
By default, the Grid exports only the currently visible data—the current page when paging is enabled, or a batch of rows when virtual scrolling is used. However, you often need to export a different data set than what appears on screen, such as all records across all pages or only selected rows.
The fetchData callback function gives you complete control over which data appears in the Excel file. This function receives the current Grid data and lets you transform or replace it before export.
Exporting Different Data Sets
You can use the fetchData callback to export all data of the Grid or various subsets based on your specific requirements.
<kendo-grid>
<kendo-grid-column></kendo-grid-column>
...
<kendo-grid-excel [fetchData]="customData"></kendo-grid-excel>
</kendo-grid>The following example demonstrates how to export all data when the Grid is paginated. Instead of exporting only the visible page, the export includes all records. The same approach works when virtual scrolling is enabled.
The fetchData function must return an ExcelExportData object or array. The function receives the current data from the Grid and lets you transform it before export. This enables various scenarios:
- Export all data—Retrieve the complete data set regardless of paging or virtual scrolling
- Export selected rows only—Export only the rows that users have selected in the Grid
- Export filtered data—Export data based on specific filtering criteria
- Export processed data—Apply custom sorting, filtering, or transformations before export
Exporting Data from Remote Sources
You can use the fetchData callback to export data from remote servers or APIs. This is especially useful when the Grid displays paginated or virtualized data, but you need to export the complete data set.
The callback function supports asynchronous data loading by accepting Observable or Promise return types, allowing you to load data from remote sources before the export begins.
<kendo-grid-excel [fetchData]="allData"></kendo-grid-excel>The following example demonstrates how to export all data from a remote source. The Grid displays paginated data, but clicking the Export button fetches the complete data set from the server and exports it to Excel.
Exporting Specific Columns
By default, the Grid exports all visible columns. To export a different set of columns than what the Grid displays, define custom columns inside the <kendo-grid-excel> component using <kendo-excelexport-column> and <kendo-excelexport-column-group>.
Use this feature to create streamlined reports that exclude technical fields like IDs or internal codes, reorganize columns for better presentation, or include additional computed fields specific to the export that aren't displayed in the Grid.
The following example demonstrates how to export a custom set of columns.
Formatting Exported Cells
By default, the Grid exports raw data values without applying any formatting. The export process works with the underlying data rather than the visual content from cell templates, so you must apply formatting directly to the exported columns.
To customize the appearance and formatting of exported cells, use the cellOptions property of the kendo-excelexport-column component.
The following example demonstrates how to format exported Excel cells using the cellOptions property.
The cellOptions property allows you to control:
- Data formatting—Apply currency, date, percentage, or custom number formats through the
formatproperty. For more details on Excel format patterns, refer to the Microsoft Create a custom number format page. - Text styling—Make text bold, italic, or underlined to emphasize important data.
- Colors—Set background and text colors to highlight specific values or create visual distinction.
- Alignment—Control horizontal and vertical text alignment within cells.
- Fonts—Specify font family and size to match your brand or reporting standards.
- Borders—Add borders to cells for better visual separation.
- Text wrapping—Enable text wrapping for cells with longer content.
Customizing Generated Workbooks
The excelExport event provides extensive control over the generated Excel document. The event exposes the complete workbook configuration, which you can modify and adjust based on your requirements before the document is saved.
The following example demonstrates how to customize the exported workbook by handling the excelExport event.
Handling the excelExport event allows you to perform advanced customization of the exported Excel document, such as:
- Add custom rows at the top or bottom of the document for headers, summary information, or footers
- Freeze rows, merge cells to create titles or group related data
- Modify existing cell values, styles, and formatting
- Add or remove sheets from the workbook
- Apply custom column widths and row heights
- Set document properties like author, title, and creation date
- Add formulas and calculations to cells
Exporting Master-Detail Grids
By default, the Grid does not export detail template content to Excel for security reasons. Detail templates can contain custom HTML and JavaScript that cannot be safely converted to Excel format. However, you can export master-detail data by handling the excelExport event and adding the detail Grid data to the workbook.
The excelExport event gives you access to the workbook structure before it is saved. You can iterate through the master Grid rows and retrieve the detail data for each row. Then insert the detail data as additional rows in the exported Excel document. This approach lets you create exports that include both master and detail information in a structured format.
The following example demonstrates how to retrieve data for all detail Grids and append it to the exported workbook.
Triggering Export Externally
Besides using the built-in export button or toolbar tool, you can trigger the Excel export programmatically from your own custom UI elements or business logic. Call the saveAsExcel method on the Grid component instance to initiate the export operation.
This approach is useful when you need to integrate the export functionality with custom buttons, menu items, or automated workflows. You can also combine it with other operations, such as validating data or applying filters before triggering the export.
The following example demonstrates how to trigger the Excel export using a custom button outside the Grid.
Making Groups Collapsible
When you export grouped Grid data to Excel, you can make each group collapsible to create a more organized and navigable document. The collapsible option creates a collapsible outline in Excel that allows users to expand and collapse groups directly in the spreadsheet.
This feature is particularly useful when exporting large data sets with multiple levels of grouping. Users can hide detailed rows and focus on summary information, then expand specific groups when they need to see the underlying data.
The following example demonstrates how to export grouped data with collapsible groups.
Known Limitations
- The Grid does not export cell templates or column templates. The export includes only the raw data values. To customize the exported content, transform your data before export or use the
fetchDatacallback. - The Grid does not export detail templates. To export master-detail Grid refer to the Exporting Master-Detail Grids section.
- The Grid does not apply column formats during export. Excel uses its own format system. Apply formatting directly to exported columns using the
cellOptionsproperty. For details on Excel format patterns, refer to the Microsoft Create a custom number format page. - Excel files have system-specific size limits. For large data sets, use a server-side solution like Document Processing library to generate Excel files.