New to Kendo UI for Angular? Start a free 30-day trial

Excel Export

The Grid provides options for exporting its data to Excel.

To enable the Excel export, import the ExcelModule and add the kendo-grid-excel component to the Kendo UI Grid for Angular. To initiate the export, use the kendoGridExcelCommand directive or the saveAsExcel method.

Example
View Source
Change Theme:

Configuration

With regard to its Excel export, the Grid enables you to:

Exporting Specific Data

By default, the Grid exports its current data. To export data that is different from the current Grid data, specify a custom fetchData function. It returns an ExcelExportData value or array. The allData() method takes a collection of data—typically, but not mandatory, the same collection to which the Grid is bound—processes it (for example, applies or removes paging, filtering, sorting, and so on), and uses the resulting object to create the workbook.

The following example demonstrates how to export all data when the content is split into pages.

Example
View Source
Change Theme:

Exporting Specific Asynchronous Data

If the export data needs to be asynchronously loaded, you can return an Observable or a Promise which will be resolved with the data that is exported.

Example
View Source
Change Theme:

Exporting Master-Detail Grids

When you export a Grid which contains a detail template to Excel, the content of the template is not exported in the generated Excel document. To export the template content to Excel, handle the excelExport event of the Kendo UI Grid for Angular and modify the created workbook so that the data for the detail Grids is integrated in the exported document.

The following example demonstrates how to perform the custom logic for retrieving the data for all detail Grids and append it to the original workbook.

Example
View Source
Change Theme:

Specifying Exported Columns

By default, the Grid exports its current columns. To export columns that are different from the current Grid columns, include the <kendo-excelexport-column> and <kendo-excelexport-column-group> components inside the <kendo-grid-excel> component.

Example
View Source
Change Theme:

Customizing Exported Columns

The Excel export functionality is configured to work with the Grid data rather than with the cell's content. That is why the values in the exported sheet have no format applied.

To customize all cells in a given column, you can set the cellOptions property of the kendo-excelexport-column component. To apply specific currency or percentage format, use the format option. For more details on the supported Excel formats, refer to the Microsoft Create a custom number format page.

 <kendo-grid-excel fileName="Products.xlsx">
        <kendo-excelexport-column field="ProductName" title="Product Name">
        </kendo-excelexport-column>
        <kendo-excelexport-column
          field="UnitPrice"
          title="Unit Price"
          [cellOptions]="{ format: '0.00$' }"
        >
        </kendo-excelexport-column>
      </kendo-grid-excel>

Customizing Generated Workbooks

The excelExport event allows you to customize the generated Excel document. The workbook event argument exposes the generated Excel workbook configuration.

Example
View Source
Change Theme:

Triggering Export Externally

The Grid enables you to trigger the export operation by calling the saveAsExcel method.

Example
View Source
Change Theme:

Making Groups Collapsible

The collapsible option allows you to create a collapsible outline for each group.

Example
View Source
Change Theme:

Known Limitations

  • During the export to Excel, the cell and detail column templates of the Grid are not evaluated. Instead, the Grid exports only the data and the field value is serialized to preserve the type information. To tweak the cell content, use an accessor or transform the data in advance.
  • During the export to Excel, the Grid does not use column formats. Column formats are incompatible with Excel. For more information, refer to the page on the Excel-supported formats.
  • The Grid does not export its detail template to Excel. The reason for this behavior is that the detail template might contain arbitrary HTML which cannot be converted to Excel column values.
  • The maximum size of the exported file to Excel has a system-specific limit. For large data sets, it is highly recommended that you use a server-side solution.
  • When you export the Grid to Excel in older browsers, such as Internet Explorer 9 and Safari, you have to implement a server proxy. For more information, refer to the proxyUrl configuration.