Question

使用一个包含3列的Kendo网格，我有一个事件，当第一列被更改时会触发一个ajax调用并返回一些数据。我想用返回的数据更新第二列，但我没有运气，我甚至不确定这是否是正确的方法。我可以通过向我的网格的数据源添加更改事件来使用静态数据更改第二列，但这当然没有帮助。我似乎可以找到的唯一示例显示使用客户端数据更改另一列，而不是从服务器返回的数据。这就是我到目前为止所拥有的：

 $("#manualStatsGrid").kendoGrid({
        dataSource: this.GetManualStatisticsDataSource(),
        sortable: true,
        pageable: false,
        filterable: true,
        toolbar: ["create"],
        editable: "inline",
        messages: {
            commands: {
                create: "Add New Statistic"
            }
        },
        edit: function (e) {
            var _this = _manualStats;
            var input = e.container.find(".k-input");

            var value = input.val();                

            input.keyup(function(){
                value = input.val();
            });                

            $("[name='Statistic']", e.container).blur(function(){
                var input = $(this);
                $("#log").html(input.attr('name') + " blurred " + value);

                //valid the GL account number
                $.ajax({
                    type: "GET",
                    url: _this.ValidateGlUrl,
                    dataType: 'json',
                    data: { glNumber: value },
                    success: function (response) {
                        var newDescription = response.Data.description;
                        console.log(newDescription);
                        //change description column here?
                    },
                    error: function (response) {
                        console.log(response);
                    }
                });


            });
        },
        columns: [
            { field: "Statistic" },
            { field: "Description" },
            { field: "Instructions" },
            { command: ["edit", "destroy"], title: "&nbsp;", width: "250px"}
        ]            
    });
}

this.GetManualStatisticsDataSource = function () {
    var _this = _manualStats;
    var dataSource = {
        type: "json",
        transport: {
            read: {
                type: "POST",
                url: _this.GetManualStatisticsUrl,
                dataType: "json"
            },
            update: {
                type: "POST",
                url: _this.UpdateManualStatisticsUrl,
                dataType: "json"
            },
            create: {
                type: "POST",
                url: _this.CreateManualStatisticsUrl,
                dataType: "json"
            },
            destroy: {
                type: "POST",
                url: _this.DeleteManualStatisticsUrl,
                dataType: "json"
            }
        },
        schema: {
            model: {
                id: "Statistic",
                fields: {                        
                    Statistic: {
                        type: "string",
                        editable: true,
                        validation: { required: true, pattern: "[0-9]{5}.[0-9]{3}", validationmessage: "Please use the following format: #####.###" }
                    },
                    Description: { editable: false },
                    Instructions: { type: "string", editable: true }
                }
            }
        }

Answer 1

在edit活动中，您有e.model。该模型具有方法set()，可以更改任何dataItem的属性值：

edit: function (e) {
    ...
    var editEvent = e; // Creates a local var with the edit's event 'e' variable to be available inside the 'blur' event
    $("[name='Statistic']", e.container).blur(function() {
        ...
        $.ajax({
            ...
            success: function(e, response) { // 'e' inside this callback is the 'editEvent' variable
                e.model.set("Description", response.Data.description); // e.model.set() will change any model's property you want
            }.bind(null, editEvent) // Binds the 'editEvent' variable to the success param
        });
    });

Working demo

制作了我头顶的片段。告诉我它是否有问题。

当另一个细胞发生变化时，用Ajax响应改变Kendo网格单元格

1 个答案: