Exporting the Grid to a CSV File

Updated on Feb 2, 2026

Environment

Product

Progress® Kendo UI for Angular Grid

Description

I want to export the Grid data to a CSV (Comma-separated values) file. Is it possible?

CSV export is now officially supported by the Kendo UI for Angular Grid. For the recommended approach, see Grid CSV Export article.

Solution

The following alternative approach uses third-party libraries to export Grid data to CSV format.

However, you can still achieve this by using any third-party library which can convert an array of JSON documents to CSV, for example, the json-2-csv library. Then, use the FileSaver package and its saveAs function to save the newly created file.

html

<kendo-grid [data]="gridData" [height]="410">
    <ng-template kendoGridToolbarTemplate>
      <button kendoButton (click)="exportToCSV()">Export to CSV</button>
    </ng-template>
    <kendo-grid-column field="ProductID" title="ID" [width]="40">
    </kendo-grid-column>
    ...
</kendo-grid>

ts

  import { json2csv } from 'json-2-csv';
  ...
  public exportToCSV() {
    json2csv(this.gridData, (err, csv) => {
      const dataURI = 'data:text/plain;base64,' + encodeBase64(csv);
      saveAs(dataURI, 'gridData.csv');
    });
  }

The purpose of this article is to provide basic guidance on how to export the Grid data to CSV. Kendo UI for Angular is not affiliated with the json-2-csv library. You can use any third-party library which supports such type of conversion.

The following example demonstrates the full implementation of the suggested approach.

Change Theme

Theme

Loading ...