Kendo Treeview: узел пытается перезагрузить содержимое при расширении, но возвращает ноль - PullRequest
0 голосов
/ 11 апреля 2019

Мы используем древовидную структуру Kendo UI для иерархического представления узлов, созданных пользователями.Каждый узел - это просто контейнер, по которому можно щелкнуть, чтобы переключить ящик под ним, который отображает задачи пользователя и другие детали.Эти данные выбираются по требованию через вызов API, когда пользователь щелкает контейнер и отображается в сетке кендо.

Каждый узел также может содержать дочерние элементы, которые можно развернуть / свернуть с помощью обычной функции Treeview: щелкнув поСтрелка на левой стороне узла показывает / скрывает все, что внизу.Дерево дочерних элементов отображается под блоком узла.

Моя проблема возникает, когда пользователь пытается расширить дочерние элементы для узла, информационный блок которого уже открыт.На этом этапе Kendo Grid уже заполнен, но функция расширения, похоже, пытается перезагрузить содержимое сетки и возвращает «Uncaught TypeError: Невозможно прочитать свойство« length »с нулевым значением», предположительно, потому что сетка пытается отобразитьnull.

До сих пор я пытался выяснить, почему функции Kendo раскрытия / свертывания пытаются перезагрузить данные узла, но безрезультатно.За один раз может быть открыт только один ящик узла, поэтому мне действительно нужно извлечь данные только один раз (когда пользователь впервые щелкает по этому конкретному узлу).

Шаблон в виде дерева:

<div class="tree"
            data-role="treeview"
            data-load-on-demand="false"
            data-auto-bind='false'
            data-drag-and-drop="true"
            data-bind="source: dsDisplayedPriorities">
        </div>

Код JS, который активно заполняет ящик узла при щелчке по узлу.Это в основном находит идентификатор приоритета (узла), выбирает все связанные с ним задачи и сохраняет его в объекте «Задачи».Этот объект выступает в качестве источника данных для сетки кендо.

clickTogglePriorityDetail: function (e: any) {
            var priorityID = e.data.RockID;
            var vmDetails = kendo.observable({
                PriorityOwner: e.data.RockOwner,
                PriorityOwnerPicture: e.data.Picture,
                PriorityDescription: e.data.RockDescription,
                PriorityName: e.data.RockName,
                Tasks: null
            });

            getPriorityTasks(priorityID).done(function (priorityTaskModel: any) {
            var retrievedTasks = new kendo.data.DataSource({
                            data: priorityTaskModel,
                            schema: {
                                model: {
                                    id: "ID"
                                }
                            }
                        });
            vmDetails.set('Tasks', retrievedTasks.options.data);
            var populatedDetail = priorityDetail.append(priorityDetailTemplate);
                        kendo.bind(populatedDetail, vmDetails);
                    }).fail(function (error: any) {
                    });
                }
        },

Шаблон с сеткой кендо, отображающий задачи:

<script id="templatePriorityInfo" type="text/x-kendo-template">
    <div class="spaced-modules">
        <div>
            <h3>
                <span data-bind="text:PriorityDescription"></span>
            </h3>
        </div>
    </div>
    <div class="spaced-modules">
        <div>
            <div class="grid thin task-preview no-scroll"
                 data-role="grid"
                 data-bind="source: Tasks"
                 data-sortable='true'
                 data-scrollable='false'
                 data-auto-bind='false'
                 data-pageable='{ "pageSize": 3 }'
                 data-row-template='priority-detail-tasks-row-template'
                 data-columns="[{title:'Related Tasks', width: 110},{title:'Due Date'}]">
            </div>
        </div>
    </div>
</script>
...