2

我很难理解TreeView小部件的内部工作原理。我指的是Kendo 代码库示例,特别是 Ajax 加载片段:

//Ajax binding data
public JsonResult Employees(string id)
{            
    XElement element = XElement.Load((Server.MapPath("~/App_Data/employees.xml")));
    IEnumerable<Employee> result;

    if (!string.IsNullOrEmpty(id))
    {
        //search for id and return it's children
        result = FindByID(id, element.Element("Employee")).Element("items").Elements("Employee").Select(e => ToEmployee(e));
    }
    else
    {
       //return first level nodes
       result = element.Elements("Employee").Select(e => ToEmployee(e)) ;
    }

    return Json(result, JsonRequestBehavior.AllowGet); 
} 

//Find the XML element by Id
private XElement FindByID(string id, XElement element)
{...}

//Convert XML element to Object
private Employee ToEmployee(XElement element)
{
    return new Employee()
    {
       id = int.Parse(element.Element("employeeId").Value),
       name = element.Element("name").Value,
       hasChildren = element.Element("items") != null
    };
}

这是使用的模型,对应于实际的 XML 结构:

public class Employee
{
    public int id { get; set; }
    public string name { get; set; }
    public bool hasChildren { get; set; }
    public List<Employee> items { get; set; }
}

视图执行以下代码:

@(Html.Kendo().TreeView()
.Name("ajaxTree")
.DataTextField("name")      
.DataSource(source =>
{
    source.Read(read =>
    {
        read.Action("Employees", "Home");
    });
})
)

困扰我的是模型需要完全按照这个例子来实现。具体来说,需要以这种方式准确指定“id”和“hasChildren”属性。例如,将“id”修改为“Id”会导致此示例无效并且TreeView不会加载。有人可以帮我解决以下问题吗?

  1. 绑定实际上是如何完成的?
  2. 为什么我必须用小写属性设计我的模型?(我知道这听起来很奇怪,但它与我(组)项目的其他格式冲突......)
  3. 有没有办法将剑道所需的“id”和“hasChildren”绑定到其他属性(相同的功能,不同的名称)?
4

1 回答 1

0

不确定您是否得到了问题的答案。

此链接http ://demos.kendoui.c​​om/web/treeview/remote-data.html 将帮助您了解模型数据如何绑定到树视图。请通过以下链接。

  1. HierarchicalDataSource - http ://docs.kendoui.c​​om/api/framework/hierarchicaldatasource
  2. 数据源 - http: //docs.kendoui.c​​om/api/framework/datasource
  3. 模型 - http ://docs.kendoui.c​​om/api/framework/model

对于问题 #2、#3

是的,可以如下配置您的模型属性:

schema: {
    model: {
        id: "EmployeeId",
        hasChildren: "HasEmployees",
        children: "EmployeeArray"
    }
}
于 2013-07-09T07:00:49.513 回答