Javascript-如何捕获焦点事件中的剑道网格单元？

在我的剑道网格中,我想在单元格中添加一些值.然后,在离开该单元格之后,根据该单元格的值,我需要在相邻的单元格上添加其他值.我怎样才能做到这一点？

我研究了以下jsfiddle,问题是每次我离开任何单元格都会触发该事件,但是我只需要为一个列的单元格触发该事件.

http://jsfiddle.net/latenightcoder/6ZNqN/1/

这是我的网格：

//To Define Columns for Yearly Holiday Kendo Grid
        var YearlyHolidayGrid = $("#YearlyHolidayGrid").kendoGrid({
            dataSource: YearlyHolidayDataSource,
            pageable: true,
            editable: true,
            edit: function (e) {
                var input = e.container.find(".k-input");
                var value = input.val();
                input.keyup(function () {
                    value = input.val();
                });
                input.blur(function () {
                    //$("#log").html(input.attr('name') + " blurred : " + value);
                    //var a = new Date();
                    //a = value;
                    //var day = a.getDay();
                    //alert(day);
                    alert(value);
                });
            },
            selectable: "row",
            navigatable: true,
            filterable: true,
            sortable: true,
            height: 200,
            columns: [
                  { field: "HLDY_SLNO", title: "SL", width: "50px" },
                  { field: "HLDY_DATE", title: "Date", width: "100px" },
                  { field: "HLDY_DAY", title: "Day", width: "100px" },
                  { field: "HLDY_NAME", title: "Holiday Name", width: "100px" },
                  { field: "HLDY_TYPE", title: "Holiday Type", width: "100px" },
                  { field: "HLDY_STATUS", title: "Holiday Status", width: "100px", editor: YearlyHolidayStatus },
                  { field: "HLDY_DFIN_TYPE", title: "Defined as", width: "100px", editor: YearlyHolidayDefinedAs },
                  { field: "HLDY_REM", title: "Remarks", width: "100px" },
                  { command: [{ name: "DeltedRow", text: "Delete"}], title: "Delete", width: 100 }
            ]
            //change: function () {
            //    var row = this.select();
            //    var id = row.data("id");

            //  //  $("#log")
            //  //      .html("selected row with id= " + id + " \
            //  //, for ShipName = " + dataSource.get(id).get("ShipName"));
            //}
        });

请帮助.

解决方法:

在定义模糊事件处理程序时,应更改选择器以仅选择所需的列.

在您说您已经学习过的JSFiddle中,它最初定义为：

edit: function(e) {
    var input = e.container.find(".k-input");
    var value = input.val();
    input.keyup(function(){
        value = input.val();
    });
    input.blur(function(){
        $("#log").html(input.attr('name') + " blurred : " + value);
    });
},

您应该将其定义为：

edit: function(e) {
    var input = e.container.find(".k-input");
    var value = input.val();
    input.keyup(function(){
        value = input.val();
    });
    $("[name='ShipName']", e.container).blur(function(){
        var input = $(this);
        $("#log").html(input.attr('name') + " blurred : " + value);
    });
},

我用作选择器[name =’ShipName’]的地方,即仅对属性名称等于ShipName的HTML输入设置模糊.

如果您现在使用修改后的版本(here)进行播放,则将看到该列为ShipName时仅在日志中显示该值.

编辑：如果您需要获取模型中的所有项目,以便可以更改另一列,则可以使用dataItem.这些步骤是：

// Find the row being edited:
var row = $(this).closest("tr");

// Get the item using `dataItem`:
var item = grid.dataItem(row);

修改后的小提琴以在ShipName模糊时显示ShipCity：http://jsfiddle.net/OnaBai/6ZNqN/116/

标签：kendo-ui,kendo-grid,javascript,jquery
来源： https://codeday.me/bug/20191122/2058724.html