更新由远程数据填充的Kendo网格列的值

问题描述 投票:0回答:1

我有一个Kendo网格,页面加载后立即呈现。网格由远程数据填充。

 logMonitoringGrid.kendoGrid({
                dataSource: {
                    batch: true,
                    transport: {
                        read: {
                            url: window.$vars['webApiHost'] + "logs",
                            dataType: "json",
                        }
                    },
                    serverFiltering: false,
                    serverPaging: false,
                    schema: {
                        model: {
                            id: "Id",
                            fields: {
                                Id: { type: "number" },
                                TTId: { type: "string" },
                                LUId: { type: "number" },
                                Level: { type: "string" },
                                Server: { type: "string" },
                                Thread: { type: "number" },
                                Message: { type: "string" },
                                Ip: { type: "string" },
                                RId: { type: "string" },
                                Timestamp: { type: "date" }
                            }
                        }
                    }
                },
                columns: columnObjects
            });

var lGrid = logMonitoringGrid.data("kendoGrid");

还有另一个API,具有所有像这样的所有租户的数据(JSON)

{
    Id: 5196
    Name: "unittest"
    ContactEmail: "[email protected]"
    Theme: "default"
    DefaultLocale: "en-US"
    IsInternal: false
}

我需要用其相应的租户名称替换网格每一行的租户ID。网格的远程数据不会随它发送任何租户名称。这就是为什么我要创建一个包含所有租户ID及其名称的地图的原因。

 var tenantData = new kendo.data.DataSource({
                transport: {
                    read: {
                        beforeSend: function (xhr) {
                            o9Util.setRequestHeaders(xhr);
                        },
                        url: crudUrl("tenants"),
                        dataType: "json"
                    }
                }
            });

            var myMap = new Map();

            tenantData.fetch(function () {
                var data = tenantData.data();
                for (var i = 0; i < data.length; i++) {
                    myMap.set(data[i].Id, data[i].Name);
                }
            })

现在我正在像这样更新网格列

lGrid.dataSource.fetch(function () {
                var data = this.data();
                for (var i = 0; i < data.length; i++) {
                    for (var [key, value] of myMap.entries()) {
                        if (parseInt(data[i].TTId) === key) {
                            data[i].set("TTId", value);
                        }
                    }
                }
            })

此方法有效,但是只要页面加载,就需要花费一些时间来更改列的值。此外,页面在一段时间后变得无响应。页面加载后,还有其他方法可以更新网格吗?

javascript jquery kendo-ui kendo-grid
1个回答
0
投票

A建议以下内容:

  1. 在Kendo调用之前先调用您的API(租户)。请记住在此请求完成时初始化网格,这意味着在DataSource's requestEnd event;

  2. 初始化网格;

  3. 在网格的requestEnd中,设置所需的值。示例:

    dataSource.schema.parse

我没有测试过,但是应该可以。

© www.soinside.com 2019 - 2024. All rights reserved.