Use Column Templates in the Grid
Environment
| Product | Progress® Kendo UI® Grid for jQuery |
| Operating System | Windows 10 64bit |
| Preferred Language | JavaScript |
Description
How can I use a column template as the value of a corresponding cell in the Excel document while exporting the Kendo UI Grid for jQuery?
Solution
The following example demonstrates how to use the column template as the value of a corresponding cell in the Excel document while exporting the Grid.
For more information on how Excel documents work, refer to the introductory help topic on Excel.
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
toolbar: ["excel"],
columns: [
{ field: "ProductName", title: "Product Name" },
{ field: "UnitPrice", title: "Price", template: 'Price: #: kendo.format("{0:c}", UnitPrice)#' }
],
pageable: true,
dataSource: {
transport: {
read: {
url: "https://demos.telerik.com/kendo-ui/service/products",
dataType: "jsonp"
}
},
pageSize: 10
},
excelExport: function(e) {
var sheet = e.workbook.sheets[0];
var template = kendo.template(this.columns[1].template);
for (var i = 1; i < sheet.rows.length; i++) {
var row = sheet.rows[i];
var dataItem = {
UnitPrice: row.cells[1].value
};
row.cells[1].value = template(dataItem);
}
}
});
</script>