函数不是第一次触发

Function not firing first time around

我正在使用 Kendo 控件(特别是 GridDrop Down Lists)。

由于 Kendo 网格组件上没有用于双击事件的内置处理程序,我编写了一些 JQuery 代码来解决这个问题。

通过检查浏览器控制台,我可以看到触发了双击事件以及从网格中提取相关数据项。

问题在于从双击函数中调用的 applySelections。我想根据行 selected 上的数据从六个 Kendo 下拉列表中预 select 值。在此之后,我在每个下拉列表上触发 change 事件以应用相关过滤器。

$(document).ready(function () {
    var grid = $("#grid").data("kendoGrid");
    grid.tbody.on("dblclick", "tr", function (e) {
        var test = grid.dataItem(this);
        applySelections(grid.dataItem(this));            
    });

    function applySelections(item) {
        $('#ddl1').data('kendoDropDownList').select(function (dataItem) {
            return dataItem.ID === item.subItems[0].ID;
        });
        $('#ddl2').data('kendoDropDownList').select(function (dataItem) {
            return dataItem.ID === item.subItems[1].ID;
        });
        $('#ddl3').data('kendoDropDownList').select(function (dataItem) {
            return dataItem.ID === item.subItems[2].ID;
        });
        $('#ddl4').data('kendoDropDownList').select(function (dataItem) {
            return dataItem.ID === item.subItems[3].ID;
        });
        $('#ddl5').data('kendoDropDownList').select(function (dataItem) {
            return dataItem.ID === item.subItems[4].ID;
        });
        $('#ddl6').data('kendoDropDownList').select(function (dataItem) {
            return dataItem.ID === item.subItems[5].ID;
        });

        $("#ddl1").data("kendoDropDownList").trigger("change");
        $("#ddl2").data("kendoDropDownList").trigger("change");
        $("#ddl3").data("kendoDropDownList").trigger("change");
        $("#ddl4").data("kendoDropDownList").trigger("change");
        $("#ddl5").data("kendoDropDownList").trigger("change");
        $("#ddl6").data("kendoDropDownList").trigger("change");
    }
}

在第一次双击时,我跟踪了代码,可以看到正在执行的初始双击功能。但是,正在触发 applySelections 函数中的 select 个事件中的 none 个。下一次,对每个下拉菜单执行相同的代码,并观察到预期的结果。

经过进一步检查,结果证明解决方案相对简单(而且显而易见)。下拉控件 autoBind 值设置为 false,这意味着我的 select 事件与 select 无关。

变化中:

var ddl1 = $("#ddl1").kendoDropDownList({
    autoBind: false
    ...
}).data("kendoDropDownList");

至:

var ddl1 = $("#ddl1").kendoDropDownList({
    autoBind: true
    ...
}).data("kendoDropDownList");

对于每个下拉控件,强制 dataSource 在页面加载时填充。

令我惊讶的是,我在尝试 select 一个尚不存在的元素时没有收到任何 Web 浏览器错误。