2017-02-16 21 views
0

Справочная информацияКендо UI TreeListViews со сложными данными

Короче я ищу, чтобы достичь «в основном» Что показано здесь ...

http://demos.telerik.com/kendo-ui/treelist/remote-data-binding

... кроме того, это немного из уклонителя ума, и данные поступают из более чем базового URL-адреса конечной точки в моем случае.

Я пытаюсь создать общую страницу построения запросов, которая позволяет пользователям выбирать контекст, затем «тип» (или конечную точку), а затем построить собственный запрос на этой конечной точке.

Мне удалось добраться до точки, где я делаю это для простого запроса, но теперь я пытаюсь обрабатывать более сложные сценарии, где я извлекаю дочерние элементы или более глубокие элементы данных из рассматриваемой конечной точки.

Имея это в виду ...

Концепция

У меня есть много конечных точек не все из которых OData но следуют в основном OData v4 правил, и поэтому я пытаюсь построить «TreeGrid» основанный на выборе конечной точки, которая будет раскрывать варианты расширения, доступные для запроса. Все мои конечные точки имеют пользовательскую функцию, называемую GetMetadata(), которая описывает информацию о типе для этой конечной точки, где конечная точка по большей части в основном представляет собой реализацию REST CRUD<T>, которая может иметь или не иметь каких-либо дополнительных пользовательских функций для обработки несколько других бизнес-сценариев.

Таким образом, учитывая HTTP GET запрос на что-то вроде ...

~/SomeContext/SomeType/GetMetadata()

... Я хотел бы получить обратно объект, который выглядит так же, как контейнер MVC/WebAPI метаданных. , этот объект имеет свойство «Свойства», некоторые из которых являются скалярными, а некоторые из них сложны (как определено в данных).

Я пытаюсь построить объект TreeListDataSource или объект HierarchicalDataSource, который я могу использовать для привязки к элементу управления treeList Kendo только для сложных свойств, который динамически создает правильный URL-адрес для мета и перечисляет сложные свойства для этого тип на основе информации о свойствах из родительского типа с конечной точкой корня, определенной в других элементах управления на странице.

Проблема

Я не могу показаться, чтобы выяснить, как настроить объект кендо источника данных для TreeGrid, чтобы получить желаемый результат, я думаю, что для, возможно, одной из двух причин ...

  1. Объект TreeListDataSource в соответствии с демонстрацией, показанной здесь: http://demos.telerik.com/kendo-ui/treelist/local-data-binding, по-видимому, подразумевает, что элемент управления на основе иерархии хочет иметь плоский источник данных.
  2. Я не могу понять, как настроить источник данных таким образом, чтобы я мог передать родительскую метаинформацию (элемент данных из источника), чтобы построить правильный URL-адрес конечной точки для запроса get.
function getDatasource(rootEndpoint) { 
    return { 
     pageSize: 100, 
     filter: { logic: 'and', filters: [{ /* TODO:possibly filter properties in here? */ }] }, 
     type: 'json', 
     transport: { 
      read: { 
       url: function (data) { 
        //TODO: figure out how to set this based on parent 
        var result = my.api.rootUrl + endpoint + "/GetMetadata()"; 
        return result; 
       }, 
       dataType: 'json', 
       beforeSend: my.api.beforeSend 
      } 
     }, 

     schema: { 
      model: { 
       id: 'Name', 
       fields: { 
        Type: { field: 'Type', type: 'string' }, 
        Template: { field: 'Template', type: 'string' }, 
        DisplayName: { field: 'DisplayName', type: 'string' }, 
        ShortDisplayName: { field: 'ShortDisplayName', type: 'string' }, 
        Description: { field: 'Description', type: 'string' }, 
        ServerType: { field: 'ServerType', type: 'string' } 
       } 
      } 
      parse: function (data) { 
       // the object "data" passed in here will be a meta container, a single object that contains a property array. 
       $.each(data.Properties, function (idx, item) { 
        item.ParentType = data; 
        item.Parent = ??? where do I get this ??? 
       }); 

       return data.Properties; 
      } 
     } 
    }; 
} 

Некоторые мои проблемы могут быть вплоть до того, что метаданные по своей сути не имеют первичные ключи, я подумал, что, возможно, с помощью разобрана, чтобы прикрепить сгенерированный Guid как ключ может быть идея, но потом Я думаю, что Kendo использует id для вопроса об API при запросе детей.

ответ

0

Так получилось, что кендо просто не настроен на то, чтобы делать что-то большее, чем обслуживать данные из одной конечной точки, и то, что я делаю здесь, немного сложнее, чем это, и еще больше к данным «данные типа не сущности». У меня нет общих вещей, таких как ключи и внешние ключи.

Имея это в виду, я выбрал взять проблему от кендо вообще и просто справиться с ситуацией с чем-то вроде «хака, который ведет себя как обычный кендо расширяться, но на самом деле не» ...

В TreeGrid , когда кендо показывает расширяемую строку он делает нечто подобное в первой ячейке ...

при отсутствии расширенных данных или источнике данных, который связан с сервером этой ячейка не отображается.

поэтому я подделал его на месте и добавил дополнительный класс к моей версии. Не загружен.

Это означало, что я мог бы подключить пользовательский блок js по щелчку моего «поддельного расширения», создать правильный URL-адрес, сделать свой собственный материал, подделать/создать некоторые идентификаторы, а затем передать данные в источник данных.

expandList.on('click', '.k-i-expand.not-loaded', function (e) { 
    var source = expandList.data("kendoTreeList"); 
    var cell = $(e.currentTarget).closest('td'); 
    var selectedItem = source.dataItem($(e.currentTarget).closest('tr')); 
    my.type.get(selectedItem.ServerType, ctxList.val(), function (meta) { 
     var newData = JSLINQ(meta.Properties) 
      .Select(function (i) { 
       i.id = selectedItem.id + "/" + i.Name; 
       i.parentId = selectedItem.id; 
       i.Selected = my.type.ofProperty.isScalar(i); 
       i.TemplateSource = buildDefaultTemplateSourceFor(i); 
       return i; 
      }) 
      .ToArray(); 

     for (var i in newData) { 
      source.dataSource.add(newData[i]); 
     } 

     $(e.currentTarget).remove(); 
     source.expand(selectedItem); 
     buildFilterGrid(); 
     generate(); 
    }); 
}); 

Таким образом, кендо получает учитывая то, что он epects для для treeviewlist «плоского набора с родителем ребенка отношений», и я делаю всю тяжелую работу.

Я использовал немного магии JSLINQ, чтобы сделать тяжелый подъем немного более «C# like» (я предпочитаю C# в конце концов), но вкратце все, что он делает, это захватить родительский элемент, который был расширен, и использует идентификатор из этого, поскольку родитель затем генерирует новый идентификатор для текущего элемента как parent.id + "/" + current.name, таким образом, все уникально, поскольку 2 свойства объекта не могут иметь одно и то же имя и где два объекта ссылаются одним и тем же родителем, префикс имени свойства parent делает ссылку уникальной.

Это не идеальное решение, но вот как обстоят дела с telerik, взломать здесь, взломать там и, как правило, можно заставить его работать!

Что-то говорит мне, что есть более умный способ сделать это!