Kendo网格数据导出到Excel文件 [英] Kendo grid data export to a excel file
问题描述
我已经配置了剑道网格并配置了所有表格行和标题.当我点击导出按钮时,它会生成一个excel文件.
IE在那里而不是生成文件,而是使用data:application/vnd.ms-excel,<table><tr><th>OrderID</th><th>Freight</th>.....
I have configured the kendo grid and configured all the table rows and header.When I click export button it is generating an excel file.But where the problem occur I don't know with same configuration I have done in
IE there instead of generating file it was showing the data format in URL with data:application/vnd.ms-excel,<table><tr><th>OrderID</th><th>Freight</th>.....
var grid = $("#grid").kendoGrid({
dataSource: {
type : "odata",
transport : {
read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
},
schema : {
model: {
fields: {
OrderID : { type: "number" },
Freight : { type: "number" },
ShipName : { type: "string" },
OrderDate: { type: "date" },
ShipCity : { type: "string" }
}
}
},
pageSize : 10
},
filterable: true,
sortable : true,
pageable : true,
columns : [
{
field : "OrderID",
filterable: false
},
"Freight",
{
field : "OrderDate",
title : "Order Date",
width : 100,
format: "{0:MM/dd/yyyy}"
},
{
field: "ShipName",
title: "Ship Name",
width: 200
},
{
field: "ShipCity",
title: "Ship City"
}
]
}).data("kendoGrid");
单击按钮以将网格数据导出到Excel.
Button click for Export Grid data to Excel.
$("#btnExport").click(function(e) {
var dataSource = $("#grid").data("kendoGrid").dataSource;
var filteredDataSource = new kendo.data.DataSource( {
data: dataSource.data(),
filter: dataSource.filter()
});
filteredDataSource.read();
var data = filteredDataSource.view();
var result = "data:application/vnd.ms-excel,";
result += "<table><tr><th>OrderID</th><th>Freight</th><th>Order Date</th><th>Ship Name</th><th>Ship City</th></tr>";
for (var i = 0; i < data.length; i++) {
result += "<tr>";
result += "<td>";
result += data[i].OrderID;
result += "</td>";
result += "<td>";
result += data[i].Freight;
result += "</td>";
result += "<td>";
result += kendo.format("{0:MM/dd/yyyy}", data[i].OrderDate);
result += "</td>";
result += "<td>";
result += data[i].ShipName;
result += "</td>";
result += "<td>";
result += data[i].ShipCity;
result += "</td>";
result += "</tr>";
}
result += "</table>";
if (window.navigator.msSaveBlob) {
window.navigator.msSaveBlob(new Blob([result]),'export.xls');
} else {
window.open(result);
}
e.preventDefault();
});
推荐答案
尝试一下,
将其放在result += "</table>";
之后,并且可以在所有浏览器中使用.
Put this after result += "</table>";
and it's working in all browser.
if (window.navigator.msSaveBlob) {
window.navigator.msSaveBlob(new Blob([result]), 'exporteddata' + postfix + 'export.csv');
}
else if (window.webkitURL != null) {
// Chrome allows the link to be clicked programmatically.
var a = document.createElement('a');
var table_div = (document.getElementById('grid').getElementsByTagName('tbody')[0]);
var table_html = table_div.innerHTML.replace();
a.href = result;
a.download = 'exporteddata' + postfix + 'export.csv';
a.click();
}
else {
window.open(result);
}
这篇关于Kendo网格数据导出到Excel文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!