Обновите значения столбца сетки Kendo, который заполняется удаленными данными - PullRequest
Новая
       8

Обновите значения столбца сетки Kendo, который заполняется удаленными данными

1 голос
/ 06 февраля 2020

У меня есть сетка кендо, которая отображается при загрузке страницы. Сетка заполняется удаленными данными. 

 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: "admin@unittest.com"
    Theme: "default"
    DefaultLocale: "en-US"
    IsInternal: false
}

Мне нужно заменить идентификатор арендатора каждой строки сетки на их соответствующие имена арендаторов. Удаленные данные сетки не отправляют имена арендаторов вместе с ним. Вот почему я создаю карту всех идентификаторов арендаторов и их имен. 

 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);
                        }
                    }
                }
            })

Этот подход работает, но требует некоторых время менять значения столбца при загрузке страницы. Более того, страница через некоторое время перестает отвечать. Есть ли другой способ обновить сетку, как только страница загрузится?

1 Ответ

0 голосов
/ 06 февраля 2020

A предлагает следующее:

  1. Сделайте вызов API (арендаторов) перед вызовом Kendo. Не забудьте инициализировать сетку, когда этот запрос завершится, это означает, что событие requestEnd источника данных ;

  2. Инициализируйте вашу сетку;

  3. В таблице dataSource.schema.parse вы устанавливаете нужные значения. Пример: 

    logMonitoringGrid.kendoGrid({
    dataSource: {
        schema: {
            parse: function(data) {
                let tenantJsonData = tenantData.data().toJSON();

                data.forEach(item => {
                    let tenantItem = tenantJsonData.find(ti => ti.Id === item.TTId);

                    if (tenantItem) {
                        item.TTTId = tenantItem.Name;
                    }
                });

                return data;
            }
        }
    }
 }

Я не тестировал его, но он должен работать.

...