<button class="k-button" id="batchGrid">
Batch Edit</button>
<div id="example" class="k-content">
<div id="batchgrid">
</div>
</div>
<script>
$("#batchGrid").click(function () {
var crudServiceBaseUrl = "http://demos.kendoui.com/service",
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl + "/Products",
dataType: "jsonp"
},
update: {
url: crudServiceBaseUrl + "/Products/Update",
dataType: "jsonp"
},
destroy: {
url: crudServiceBaseUrl + "/Products/Destroy",
dataType: "jsonp"
},
create: {
url: crudServiceBaseUrl + "/Products/Create",
dataType: "jsonp"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
return { models: kendo.stringify(options.models) };
}
}
},
batch: true,
pageSize: 20,
schema: {
model: {
id: "ProductID",
fields: {
ProductID: { editable: false, nullable: true },
ProductName: { validation: { required: true} },
UnitPrice: { type: "number", validation: { required: true, min: 1} },
Discontinued: { type: "boolean" },
UnitsInStock: { type: "number", validation: { min: 0, required: true} }
}
}
}
});
$("#batchgrid").kendoGrid({
dataSource: dataSource,
dataBound: onDataBound,
navigatable: true,
filterable: true,
pageable: true,
height: 430,
width: 300,
toolbar: ["create", "save", "cancel"],
columns: [
"ProductName",
{ field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "130px" },
{ field: "UnitsInStock", title: "Units In Stock", width: "130px" },
{ field: "Discontinued", width: "130px" },
// { field: "", title: "No", template: "#= ++record #", width: "30px" },
{command: ["destroy"], title: " ", width: "100px"}],
editable: true
});
});
</script>
<script>
function onDataBound(e) {
var grid = $("#batchgrid").data("kendoGrid");
$(grid.tbody).on("keydown", "td", function (e) {
if ((e.keyCode ? e.keyCode : e.which) == 13) { //Enter keycode
var row = $(this).closest("tr");
var rowIdx = $("tr", grid.tbody).index(row);
var colIdx = $("td", row).index(this);
alert(rowIdx + '-' + colIdx);
$this.closest('tr').next().find('td').eq(index).focus();
e.preventDefault();
}
});
}
</script>
在这里，当我按下编辑模式中的回车键（插入新记录）时，我需要进入下一个单元格（就好像我按下标签键）。
以及如果我按任意行的最后一个单元格（最后一列）中的回车键，它应移动到下一行的第一个单元格（第一列）。
我认为问题出现在我的剧本中。但是不确切地知道在哪里。
请在这里帮助我..
答案 0 :(得分：2)
试试这段代码： -
<script>
$(document).ready(function(){
$("#KendoGridName").keypress(function(e){
var keyCode = e.keyCode || e.which;
if (keyCode == 13) {
var grid = $("#KendoGridName").data("kendoGrid");
var curCell = grid.find(".k-edit-cell");
grid.editCell(curCell.next()); // To move the cursor to the next cell and put the cell in edit mode
grid.select(curCell.next()); // To select the next cell
grid.focus(curCell.next()); // To set focus on to next cell
e.preventDefault(); // To prevent the default behavior of the enter key press
}
});
});
</script>
注意： - 您也可以使用keydown函数（e）{}代替按键功能（e）。
如果代码不起作用或有一些缺陷，请通过您的意见。我在MVC5中试过这个，它与Kendo Grid一起工作。
答案 1 :(得分：1)
你也可以尝试这个
$("#grid").on("focus", "td", function (e) {
$("input").on("keydown", function (event) {
if (event.keyCode == 13) {
setTimeout(function () {
var grid = $("#grid").data("kendoGrid");
var curCell = $("#grid").find(".k-edit-cell");
grid.editCell(curCell.next());
});
}
});
}）;
答案 2 :(得分：0)
尝试此代码，它可以帮助您在输入按键时移动下一个单元格，
$(document).ready(function () {
$("#batchGrid").on("click", "td", function (e) {
var rowIndex = $(this).parent().index();
var cellIndex = $(this).index();
window.onkeydown = function (event) {
if (event.keyCode == 13) {
$("#batchGrid").data("kendoGrid").editCell($(".k-grid-content").find("table").find("tbody").find("tr:eq(" + rowIndex + ")").find("td:eq(" + cellIndex + ")").next().focusin($("#batchGrid").data("kendoGrid").closeCell($(".k-grid-content").find("table").find("tbody").find("tr:eq(" + rowIndex + ")").find("td:eq(" + cellIndex + ")").parent())));
答案 3 :(得分：0)
这已经晚了一年，但也许有人可以从中得到一些东西。我有一张Telerik的票，他们的回答是按照设计标签到下一个可编辑的单元格。不可接受的。
我需要从一个可编辑的单元格转到另一个单元格并忽略不可编辑的单元格，所以这就是我这样做的方式： http://dojo.telerik.com/@barbedCoil/OhaYo/3
由于我混合使用硬编码的单元格索引，理想情况下，我希望使用css属性在单元格之间导航（下一版本）
无论如何，这是一个好的开始
答案 4 :(得分：0)
$("#GridID").keypress(function (e) {
if (e.keyCode === 13) {
e.preventDefault();
}
});
请参阅经过测试的代码：
https://www.telerik.com/forums/how-to-prevent-kendo-validation-on-pressing-enter-key
答案 5 :(得分：-2)
试试这个
$('.k-edit-field .k-input').on('keypress', function (e) {
if(event.keyCode == 13)
$('.k-edit-field .k-input').next().focus(); //This statement will be used where you want to provide focus
});
您可以使用由剑道网格附加的剑道编辑网格文本框