Question

我试图修改kendo Grid的InCell编辑模式的行为。我的意思是我试图使用箭头导航到细胞但我在做这个问题时遇到了问题。

这是我的代码：

$("#grid").keydown(function (e) {
    debugger;
    isEditStarted = true;
    var totlaColumns = $($(" #grid td")[0]).nextAll().length + 1;
    currentTD = $(" #grid td.k-edit-cell");
    var indexx = $("#grid td").index($(" #grid td.k-edit-cell"));
    //currentTDIndex = $(currentTD).parent().children().index($(currentTD)) + 1;
    if (isEditStarted) {
        var code = e.keyCode || e.which;
        if (code === 37) {


            //left Key
            //var eventEnter = jQuery.Event("keypress");
            //eventEnter.which = 18;
            //eventEnter.keyCode = 18;
            var x = "#" + $($(" #grid td")[$(" #grid td").index($(" #grid td.k-edit-cell"))]).find('input').attr('id');
            var valuem = $(x).val();
            var position = $(currentTD).prevAll("td").length + 1;
            var length = $(currentTD).prevAll("td").length;
            if (length > 1) {

                debugger;
                $("#grid tr td").removeClass('BorderHighlight');
                $(x).val(valuem);
                $($(currentTD).prevAll("td")[0]).click();
                $($(currentTD).prevAll("td")[0].childNodes[0]).addClass('BorderHighlight');

            }


        }
        else if (code === 38) {
            currentTD = $(" #grid td.k-edit-cell");
            var position = $(currentTD).prevAll("td").length + 1;
            var currentRow = $(" #grid td.k-edit-cell").parent().parent().find('tr').index($(" #grid td.k-edit-cell").parent());
            var newPosition = currentRow > -1 ? (currentRow - 1) * totlaColumns + position - 1 : 0;
            $($(" #grid td")[newPosition]).click();
            $($(" #grid td")[newPosition].childNodes[0]).addClass('BorderHighlight');

        }
        else if (code === 39) {
            currentTD = $(" #grid td.k-edit-cell");
            var length = $(currentTD).nextAll("td").length;
            if (length > 1) {
                $("#grid tr td").removeClass('BorderHighlight');
                $($(currentTD).nextAll("td")[0]).click();
                $($(currentTD).nextAll("td")[0].childNodes[0]).addClass('BorderHighlight');
            }

        }
        else if (code === 40) {
            currentTD = $(" #grid td.k-edit-cell");
            var position = $(currentTD).prevAll("td").length + 1;
            var currentRow = $(" #grid td.k-edit-cell").parent().parent().find('tr').index($(" #grid td.k-edit-cell").parent());
            var newPosition = currentRow > -1 ? (currentRow + 1) * totlaColumns + position - 1 : 0;
            $($(" #grid td")[newPosition]).click();
            $($(" #grid td")[newPosition].childNodes[0]).addClass('BorderHighlight');
        }
    }

})

这是 Demo了解功能。我能够通过键导航出网格，但这样做时网格值没有被保存。我的意思是当我单击一个空单元格，然后输入一个值并使用右箭头移动到下一个单元格，然后不保存以前的值。但是当我们单击Enter或Tab或alt（两次）然后移动到下一个单元格然后保存值时，将保存该值

PS：附带演示链接

Answer 1

在将焦点设置到下一个单元格之前，您需要调用_handleEditing。您也不需要单击网格并删除类;你只需要这个（右箭头的例子）：

var code = e.keyCode || e.which,
    grid = $("#grid").data("kendoGrid"),
    current = grid.editable.element,
    next = $(current).nextAll("td").eq(0),
    container = $(e.target).closest("[role=gridcell]"),
    length;

if (code === 39) {
    length = $(current).nextAll("td").length;
    if (length > 1) {

        if (!container[0]) {
            container = current;
        }

        grid._handleEditing(container, next, e.currentTarget);
    }
}

移动到下一个单元格后，Kendo Grid不保存值

1 个答案: