kendo-ui - Kendo UI Grid 导出到 Excel 不起作用
问题描述
我有类似的问题,为什么我的excel
导出按钮不起作用?它有什么问题。感谢帮助。
$("#grid").kendoGrid({
toolbar: ["create", "excel", "pdf"],
excel: {
fileName: "Test.xlsx",
allPages: true
},
columns: [
{ field: "name" },
{ field: "age" }
],
dataSource: {
data: [
{ id: 1, name: "Jane Doe", age: 30 },
{ id: 2, name: "John Doe", age: 33},
],
schema: {
model: { id: "id" }
}
},
editable: true
});
.k-grid-toolbar {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.k-grid-toolbar .k-grid-excel {
margin-left: auto;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.mobile.all.min.css"/>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script>
</head>
<body>
<div id="grid"></div>
</body>
</html>
解决方案
如果您检查浏览器的控制台,您会发现 Kendo 遗漏了一些库。“要充分利用 Excel 导出功能,请下载 JSZip 库并将该文件包含在 Kendo UI JavaScript 文件之前,如图所示”:https ://docs.telerik.com/kendo-ui/framework/excel/introduction #要求
推荐阅读
- reactjs - 对于下面给出的代码,状态值(在 Test2.js 上)在 react-native 中没有改变
- omnet++ - 有没有办法在 Omnet 上嗅探/侦听单播数据包/消息?
- php - 将 Magento 升级到 2.2.8 期间的 PHP 扩展问题
- mysql - MySQL多列Sum()在不同/多行中
- emacs - emacs helm:有什么方法可以让它服从模板颜色?
- function - Julia中带参数的映射函数
- python - 如何在python中<n^2次查找任意大小列表的重复项?
- xamarin.forms - Control.SetText 不会更改 ButtonRenderer 中的文本
- if-statement - 谷歌表格中的参考文献随着新的表单提交而改变
- javascript - 如何通过提供的属性交换数组内的对象顺序