Интерфейс Telerik (Kendo) для ASP.NET проблемы с MVC TreeView

Я использую MVC 5 и последнюю версию Telerik (ранее Kendo) UI для ASP.NET MVC. Я работаю с иерархическими данными. Я пытаюсь создать объект TreeView в файл _Layout и заполнить его URL или ссылок.

мой текущий код:

в файл _Layout:

@Html.Partial("_ProductTree")

"_ProductTree" Частичный Вид:

@(Html.Kendo().TreeView().Name("ProductTree")
    .DataSource(d => d
        .Model(m => m
            .Id("ProductId")
            .HasChildren("Categories"))
    .Read(r => r.Action("_ProductTree", "Home")))
    .DataTextField("ProductName"))

Метод Действия:

[ActionName("_ProductTree")]
public JsonResult GetProductTree()
{
    var products = _productBusinessService.GetProducts();

    var result = products.Select(p => new
    {
        p.ProductID,
        p.ProductName,
        Categories= c.Categories.Any()
    }).OrderBy(t => t.ProductName);

    return Json(result, JsonRequestBehavior.AllowGet);
}

у меня есть ряд вопросы:

  1. когда я разворачиваю родительский узел, у которого есть дети, TreeView поражает метод действия и добавляет все дерево к ребенку, а не просто отображает детей.
  2. мне нужно иметь возможность вложить TreeView два глубоких, например Product > Category > Type.
  3. я пытаюсь выяснить, как агрегировать или проецировать данные с помощью LINQ, чтобы сделать два-глубокий higherarchy.
  4. я попытался выключить LoadOnDemand, но это заставило TreeView вызвать метод действия один раз для каждой записи в списке продуктов.

Я попытался вставить код TreeView Razor непосредственно в представление _Layout (не используя частичное представление). Я понимаю, что мне может потребоваться переместить метод action в базовый класс контроллера и наследовать его в каждом контроллере, чтобы остановить его от добавления списка к родительскому узлу. Если я не могу получить эту работу в ближайшее время, мне, возможно, придется использовать Kendo UI Professional или открыть альтернативный источник.

некоторые из вас могут поддаться искушению сказать, что на этот вопрос был дан ответ в другом месте. ни одна из сообщений, которые я нашел, не затрагивает проблемы заполнения и отображения вложенных (более одного глубокого) иерархических данных с помощью Telerik TreeView.

есть этот пост

вложенные источники данных и TreeView с Kendo ui

но это для версии JavaScript TreeView (не для пользовательского интерфейса для В MVC) и никто не ответил.

заранее спасибо за вашу помощь!

1 ответов


решение в коде:

в файл _Layout вид:

@Html.Partial("_ProductTree")

или

@RenderSection("productTree", false)

затем в представлении содержимого

@section productTree
{
    @Html.Partial("_ProductTree")
}

в _ProductTree частичный вид

@(Html.Kendo().TreeView().Name("ProductTree")
    .DataSource(d => d
        .Model(m => m
            .Id("Id")
            .HasChildren("HasChildren")
            .Children("Children"))
    .Read(r => r.Action("_ProductTree", "Home")))
    .DataTextField("Name"))

я переместил метод action в абстрактный класс BaseController, который может быть унаследован любым контроллером, который должен отображать TreeView ProductTree. Данные были извлечены из ProductService и CategoryService и агрегированы с использованием проекции LINQ в анонимные объекты:

    [ActionName("_ProductTree")]
    public JsonResult GetProductData()
    {
        var products = _productBusinessService.GetProducts();

        foreach (var product in product)
        {
            foreach (var category in product.Categories)
            {
                category.ProductTypes =
                    _productService.GetProductTypes(category.CategoryId);                                           
            }
        }

        var productTreeData = products.Select(p => new
        {
            Id = p.ProductId,
            Name = p.ProductName,
            HasChildren = p.Categories.Any(),
            Children = p.Categories.Select(c => new
            {
                Id = c.CategoryId,
                Name = c.CategoryName,
                HasChildren = c.ProductTypes.Any(),
                Children = c.ProductTypes.Select(t => new
                {
                    Id = t.ProductTypeId,
                    Name = t.ProductTypeName,
                    HasChildren = false
                }).OrderBy(t => t.Name).ToList()
            }).OrderBy(c => c.Name).ToList()
        }).OrderBy(p => p.Name).ToList();

        return Json(productTreeData, JsonRequestBehavior.AllowGet);
    }

результатом является 3-глубокий, полностью заполненный, отсортированный интерфейс Telerik для ASP.NET Treeview, содержащий имена и идентификаторы продукта > > категория > > ProductType. Включение или выключение LoadOnDemand, казалось, не имело значения в этом случае. Это должно иметь значение при использовании Bind в TreeView.

надеюсь, это поможет!