Kendo Grid下拉联动：Change事件实现跨Grid下拉值自动修改

整体逻辑分三步完成：

• 在Grid1进入编辑状态时，给Column1渲染出的DropdownList控件绑定change事件，避免非编辑状态下控件不存在导致事件绑定失效。
• change事件触发时，判断当前下拉选中值，仅当值为Request或Ignore时执行联动逻辑。
• 匹配Grid2中与Grid1当前编辑行对应的目标行，将该行Column1字段值更新为Ignore，同时触发Grid视图刷新保证界面同步显示。

首先在Grid1初始化配置中添加edit事件回调，在回调内给Column1的下拉控件绑定change事件：

$("#grid1").kendoGrid({
    // 其余原有配置（数据源、列定义、工具栏等）保持不变
    edit: function(e) {
        // 校验当前编辑列是否为Column1，避免给Column2误绑事件
        const column1Input = e.container.find("input[name='Column1']");
        if (!column1Input.length) return;

        const column1Dropdown = column1Input.data("kendoDropDownList");
        column1Dropdown.bind("change", function() {
            const selectedValue = this.value();
            if (selectedValue === "Request" || selectedValue === "Ignore") {
                syncGrid2Column1Value(e);
            }
        });
    }
});

实现联动更新的核心方法，根据自身业务选择行匹配规则即可：

function syncGrid2Column1Value(grid1EditEvent) {
    const grid1 = $("#grid1").data("kendoGrid");
    const grid2 = $("#grid2").data("kendoGrid");
    const grid1CurrentRow = grid1EditEvent.container.closest("tr");
    const grid1CurrentData = grid1.dataItem(grid1CurrentRow);

    // 方案1：如果两个Grid行顺序完全一致，按索引匹配
    // const rowIndex = grid1CurrentRow.index();
    // const grid2TargetData = grid2.dataSource.data()[rowIndex];

    // 方案2（推荐）：如果两个Grid通过唯一主键关联（比如共有的业务Id字段），按主键匹配，不受排序、分页、筛选影响
    const grid2TargetData = grid2.dataSource.data().find(item => item.BizId === grid1CurrentData.BizId);

    if (grid2TargetData) {
        // 用set方法修改值，自动触发Grid视图更新
        grid2TargetData.set("Column1", "Ignore");
    }
}

• 不要在Grid初始化完成后直接查找DropdownList绑定事件：非编辑状态下Grid单元格是普通文本节点，DropdownList控件未渲染，事件会绑定失败。
• 修改Grid2数据时必须调用数据项的set()方法，不要直接给字段赋值（比如grid2TargetData.Column1 = "Ignore"），这种写法不会触发Kendo MVVM的视图刷新，界面会保留旧值。
• 如果联动触发时Grid2的Column1正处于编辑状态，需要额外获取当前编辑行的DropdownList控件，调用.value("Ignore")更新编辑器显示值，否则编辑态的控件会显示旧值。
• 行匹配规则优先选唯一主键关联，不要硬编码行索引，Grid排序、筛选、分页后行索引会变化，会导致更新错行。

内容的提问来源于stack exchange，提问作者Nagarjuna