使用服务器端包装器的具有分层数据源的 Kendo TreeView答案

【问题标题】：Kendo TreeView with Hierarchial Data Source using ServerSide Wrappers使用服务器端包装器的具有分层数据源的 Kendo TreeView
【发布时间】：2013-04-20 18:12:23
【问题描述】：

如何使用 MVC ServerSide 包装器创建 HierarchialDataSource 并将其用作 TreeView 的数据源？

我创建了一个层次结构，它作为 Json 从控制器返回，但 TreeView 只显示顶级节点。是否需要在 TreeView 上设置一个属性来指示 DataSource 是分层的？

我看到了几个使用 JS 和 kendo.data 库的客户端示例，但我找不到服务器端等效程序集。

感谢您的帮助。

【问题讨论】：

标签： asp.net-mvc treeview kendo-ui datasource

【解决方案1】：

据我了解，您要绑定的模型的属性必须与 HierarchicalDataSource 匹配： http://docs.kendoui.com/api/framework/hierarchicaldatasource

我正在使用树视图来显示菜单结构，所以这是我的模型：

public class Menu
{
    public int Id { get; set; }
    public int? ParentId { get; set; }
    public string Description { get; set; }

    public int id
    {
        get { return this.Id; }
    }                

    public bool hasChildren { get; set; }
}

我明确地必须使用这种精确的大小写来实现 id 和 hasChildren 属性（在将模型推送到视图之前，我会根据查询填充 hasCHildren 属性）。

不确定这是否是正确的做法（仍在努力寻找官方信息），但至少它有效。

【讨论】：

【解决方案2】：

在你的cshtml文件中使用这个：

@(Html.Kendo().TreeView()
   .Name("trvReport")
   .DataTextField("Name")
   .DataSource(dataSource => dataSource
      .Read(read => read.Action("ReportType", "Read"))
      .Model(model =>
      {
        model.Id("Id");
        model.Field("Name", typeof(string));
        model.Children("Reports");
        model.HasChildren("HasReports");
      })
   )
)

像这样在你的模型中实现 HasChildren：

public class ReportType
{
    public int Id { get; set; }
    public string Name { get; set; }

    public ICollection<Report> Reports { get; set; }

    [NotMapped]
    public bool HasReports { get { return Reports.Count() > 0; } }
}

【讨论】：