Ajax绑定
您可以为Ajax绑定配置Telerik UI树列表,以便在加载子节点、排序或筛选时发出Ajax请求。
当配置为Ajax绑定时,用于ASP的Telerik UI树列表。NET MVCmakes Ajax requests when doing sorting, filtering or when expanding a node.
ajax绑定模式具有以下特点:
TreeList只检索表示当前关卡项目的数据(JSON格式)。
要利用惰性加载,请定义
hasChildren
模型的属性public class EmployeeViewModel {// Id。public int EmployeeID {get;设置;}
公共字符串FirstName {get;设置;} //该属性区分大小写。只有当您想使用惰性加载时才定义它。//如果没有定义,树列表将在客户端上计算并赋值。public bool hasChildren {get;设置;}
}
- 所有列模板都在客户端执行。他们遵循jQuery模板的Kendo UI定义规则,可能包含嵌入的JavaScript代码。
为ASP配置树列表。NET MVC做Ajax绑定:
- 创建一个新的ASP。NET MVCweb application. Follow the steps from the介绍性的文章为ASP添加Telerik UI。NET MVCto the application.
打开
HomeController.cs
并添加一个新的操作方法,它将以JSON的形式返回项目。TreeList向该操作发出Ajax请求。public IActionResult TreeList_Read() {}
添加一个类型的新参数
Kendo.Mvc.UI.DataSourceRequest
到行动。它将包含关于排序、聚合和过滤的当前TreeList请求信息。修饰该参数Kendo.Mvc.UI.DataSourceRequestAttribute
.属性将填充DataSourceRequest
对象。现在导入Kendo.Mvc.UI
名称空间。还要添加另一个参数,以指示展开了哪个父节点。public IActionResult TreeList_Read([DataSourceRequest]DataSourceRequest request, int?Id) {}
使用
ToTreeDataSourceResult
扩展方法将项集合转换为Kendo.Mvc.UI.TreeDataSourceResult
对象。该扩展方法将过滤、排序、计算聚合并仅找到您的数据的当前级别项使用的信息DataSourceRequest
对象。要使用ToTreeDataSourceResult
扩展方法,导入Kendo.Mvc.Extensions
名称空间。public JsonResult Index([DataSourceRequest] DataSourceRequest请求,int?id) {var result = ((EmployeeDirectoryService) employeeDirectory). getallremote()。ToTreeDataSourceResult(request, e => e. employeeid, e => e. reportto, e => id。HasValue吗?e. reportto == parentId: e. reportto == null, e => e);}
返回
TreeDataSourceResult
为JSON。为Ajax绑定配置Telerik UI树列表。public JsonResult Index([DataSourceRequest] DataSourceRequest请求,int?id) {var result = ((EmployeeDirectoryService) employeeDirectory). getallremote()。ToTreeDataSourceResult(request, e => e. employeeid, e => e. reportto, e => id。HasValue吗?e. reportto == parentId: e. reportto == null, e => e);返回Json(结果,JsonRequestBehavior.AllowGet);}
在视图中,配置TreeList以使用在前面步骤中创建的操作方法。
@(Html.Kendo(). treelist
() . name ("treelist") . columns (columns => {columns. add()。字段(f => f.FirstName). width(250)。标题(“名字”);columns.Add()。字段(e => e. lastname)。标题(“姓”);columns.Add()。Field(e => e. position);columns.Add()。字段(e = > e.Extension) .Title (Ext) .Format(“{0:#}”);}) . filterable () . sortable () . dataSource (dataSource => dataSource . read (read => read.)Action("Index", "EmployeeDirectory")) .Model(m => {m.e id (f => f. employeeid);f. parentid (f => f. reportto).Nullable(true);m.Field(f => f. firstname); m.Field(f => f.LastName); m.Field(f => f.ReportsTo); }) .Aggregates(x=> x.Add(y=> y.BirthDate).Count()) ) ) 构建并运行应用程序。