如何在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>主要代码：
$("#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
}
});