如何动态添加Kendo内联网格底部的行 -
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何动态添加Kendo内联网格底部的行 -相关的知识,希望对你有一定的参考价值。
如何在Angular 4中动态添加Kendo内联网格底部的行。
- 标签关闭最后一行的最后一个单元格时如何自动添加新行?
答案
没有任何代码很难帮助你。但这是你可以做的:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.911/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.911/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.911/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.911/styles/kendo.mobile.all.min.css">
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.3.911/js/angular.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.3.911/js/jszip.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.3.911/js/kendo.all.min.js"></script>
<script>
$(function() {
$("#grid").kendoGrid({
dataSource: {
data: [{ Name: "John Doe", Age: "31" }]
},
editable: "incell"
});
$("#grid").on("focusout", "input", function() {
let grid = $("#grid").data("kendoGrid"),
$td = $(this).closest("td"),
$tr = $td.parent(),
tdCount = $tr.find("td").length;
if ($td.index() == (tdCount - 1)) {
// Add a new empty row at the beginning
//grid.addRow();
// Add a new empty row at the end
grid.dataSource.add({});
grid.editCell(grid.tbody.find("tr:last td:first")); // Open the cell for editing
}
});
});
</script>
</head>
<body>
<div id="grid"></div>
</body>
</html>
以上是关于如何动态添加Kendo内联网格底部的行 -的主要内容,如果未能解决你的问题,请参考以下文章
如何在 MVC 应用程序中转置 Kendo UI 网格中的行和列?
kendo 将 HTML 元素绑定到网格选定的行/dataItem