Excel Export Overview
As of the Kendo UI 2014 Q3 release, Kendo UI has provided Excel generation support.
Excel export allows you to create Excel documents in JavaScript and save them on the client machine.
The Excel Export is part of Kendo UI for jQuery, a
professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
Requirements
To take full advantage of the Excel export feature, download the JSZip library and include the file before the Kendo UI JavaScript files.
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.js"></script>
<script src="https://kendo.cdn.telerik.com/2023.1.425/js/kendo.all.min.js"></script>
JSZip is part of the Kendo UI distribution and is also available through the Kendo UI CDN:
<script src="https://kendo.cdn.telerik.com/2023.1.425/js/jszip.min.js"></script>
- If you do not include JSZip in the page, Kendo UI will raise a runtime exception.
- As of the Kendo UI R3 2017 release, the Excel Export feature supports JSZip 2.* and 3.* versions. Kendo UI releases prior to R2 2017 SP1 provided Excel export of JSZip 2.* versions only.
When you use JSZip in scenarios where the packages are loaded from NPM, explicitly assign the JSZip object to a field in the window object. To properly load JSZip in the application:
- Install the library and save it to the
package.jsonfile by runningnpm install jszip --save. - Import the library in the module where it will be used through
import JSZip from 'jszip'. - Assign the library object to a field of the
windowby settingwindow.JSZip = JSZip.
Compatibility with Other Libraries
- GlobalizeJS—If you want to use GlobalizeJS in your project, include it after the Kendo UI scripts.
- RequireJS—JSZip requires some extra initialization code to work with RequireJS. For more information on using RequireJS with the Kendo UI Excel export functionality, refer to the related article.
Browser Support
Excel generation is available for all supported browsers. Saving a file needs a server-side proxy for older browser versions. For more information, refer to the article on saving files with Kendo UI.
Some mobile browsers do not support saving of files.
Creating Excel Documents
To create an Excel document (workbook):
- Instantiate a
kendo.ooxml.Workbook. The workbook has an array of sheets. Sheets have rows and rows have cells. - Call the
toDataURLortoDataURLAsyncmethods of the workbook to get the output Excel file as a data URI. - Call the
kendo.saveAsmethod to save the Excel file on the client machine.
<script>
var workbook = new kendo.ooxml.Workbook({
sheets: [
{
// The column settings (width).
columns: [
{ autoWidth: true },
{ autoWidth: true }
],
// Th title of the sheet.
title: "Customers",
// The rows of the sheet.
rows: [
// The first row (header).
{
cells: [
// The first cell.
{ value: "Company Name" },
// The second cell.
{ value: "Contact" }
]
},
// The second row (data).
{
cells: [
{ value: "Around the Horn" },
{ value: "Thomas Hardy" }
]
},
// The third row (data).
{
cells: [
{ value: "B's Beverages" },
{ value: "Victoria Ashworth" }
]
}
]
}
]
});
kendo.saveAs({
dataURI: workbook.toDataURL(),
fileName: "Test.xlsx"
});
</script>