如何动态更新KendoUI网格中的其他行字段?

时间:2014-05-27 21:37:28

标签: kendo-ui angularjs-directive kendo-grid

在我的KendoUI数据源中,我定义了以下内容:

    change: function (e) {
        if (e.action === "itemchange") {
            // auto-format Display As
            var geoDisplay, geoUrl;
            if (e.items[0].GeoState.length > 0) {
                geoDisplay = e.items[0].GeoCity + ", " + e.items[0].GeoState;
            } else {
                geoDisplay = e.items[0].GeoCity;
            }
            //this.dataItem(this.select()).GeoDisplay = geoDisplay;

            e.items[0].GeoCity = "updated: " + e.items[0].GeoCity;  // visually updates if editing this field
            e.items[0].GeoDisplay = geoDisplay;  // field is not updated
        }
        console.log("change: " + e.action);
        console.log(e);
        // do something else with e
    },

基本上我想根据字段的输入更新正在编辑的行上的其他字段。

在此示例中,GeoCity已更新。触发itemchange事件,仅使用新值更新GeoCity字段。但是我可以从数据中看到其他字段'数据已更新。

我尝试过.sync()和其他一些方法来实现这一点,但到目前为止还没有运气。

顺便提一下,我的网格是在AngularJS指令中定义的,它的onEdit事件并不是我要找的东西,因为我想要在每个字段时触发的事件更新,而不是整行。

如何让其他字段可视化更新?

2 个答案:

答案 0 :(得分:0)

我设法通过在数据源代码中放置以下代码来解决问题:

    change: function (e) {
        if (e.action === "itemchange") {
            // auto-format Display As
            var thisRow = $("#accountGeoLocationEditorGrid tbody").find(".k-grid-edit-row");

            // update geo display 
            if (e.field === "GeoCity" || e.field === "GeoState") {
                var geoDisplay, geoUrl;
                if (e.items[0].GeoState.length > 0) {
                    geoDisplay = e.items[0].GeoCity + ", " + e.items[0].GeoState;
                } else {
                    geoDisplay = e.items[0].GeoCity;
                }

                if (e.items[0].GeoDisplay.length == 0) {
                    e.items[0].GeoDisplay = geoDisplay;
                    thisRow.find("input[name=GeoDisplay]").val(geoDisplay);
                }
            }
        }

我真的在寻找另一种方法,因为我并不想在定义的数据源中进行DOM查找等。

欢迎提出其他建议。

答案 1 :(得分:0)

您是否尝试过网格refresh()方法?在change活动的更改结束时,请拨打此行(使用您的网格正确的ID)

$("#grid").data("kendoGrid").refresh();

我已经在我的网格和剑道样本上对此进行了测试,它的工作正常。您正在编辑数据源,但网格不知道您已完成的额外更改,但已编辑的单元格除外。调用刷新将更新网格上的所有单元格以反映数据源。