php - 双击编辑 Kendo Grid incell 或内联编辑

Question

我正在应用程序中使用 Kendo Grid。要求是使网格在双击时可编辑。我正在处理 .dblclick 事件，并使用 .editCell(cell) 以编程方式使单元格可编辑。问题是我需要在有人单击单元格外部或按下 Enter 或 Return 按钮时保存更改，并在有人单击 ESC 时撤消更改。此外，当日期无效时，我不应该保存它。

我尝试了焦点、模糊、点击事件，但有些有效，有些无效，有些重叠并且不允许单元格打开。

这是我的代码。

//code for double click;
$('#grid').delegate('tbody>tr>td','dblclick', function (e) {
        console.log("double clicked");
        if($(".k-grid-edit-row").length <= 0) {
            $("#grid").data("kendoGrid").editCell($(this));
           }
    });

$('#grid tbody').on('blur','input,select,textarea',saveGrid);
    $('#grid').delegate('tbody>tr>td','focusout',function() {
        console.log("inside focusout");
        if($(this).hasClass("k-edit-cell"))
            return;
        saveGrid();
    });
    $('#grid').delegate('tbody>tr>td','click', function(e){
        console.log("singleClick called");
        if($(this).hasClass("k-edit-cell"))
            return;
        saveGrid();
    });

    function saveGrid() {
        console.log("save grid called");
        var grid = $("#grid").data("kendoGrid");
        var editedCellIndex =grid.cellIndex(grid.tbody.find(">tr td.k-edit-cell"));
        console.log("this cell index:"+grid.cellIndex($(this)));
        console.log(" Edited cell index :"+editedCellIndex);
        if(editedCellIndex<0) {
            return false;
        } 
        if($(".k-grid-edit-row").hasClass("k-invalid")) {
            return false;
        }
        grid.closeCell();
        console.log("saving changes");
        grid.saveChanges();
    }

如果您需要更多信息，请告诉我。

Answer 1

要在有人按出网格时获取事件(调整函数以检查单元格外)，请使用以下命令:

$('html').on('click', function (e) {
if (!$(e.target).parent().hasClass('k-master-row') && !$(e.target).hasClass('k-input')) {
    var grid = $("#Grid").data("kendoGrid")
    //use this if the row was selected
    //grid.clearSelection();

    //do something
    grid.saveChanges();
}

});

请注意，这可能会扰乱其他点击事件，它会阻止我在我的项目中在任何其他 jQuery 代码中使用 .on() (因此我使用已弃用的 .live( ) )，所以这不是一个理想的解决方案