OrgChart概述

组织结构图是Telerik UI for ASP。NET MVC，一个具有 110+ 组件的专业级UI库，用于构建现代和功能丰富的 应用程序。想要试用它，可以注册一个30天的免费试用期。

下载免费试用

Telerik UI OrgChart HtmlHelper for ASP。NET MVCis a server-side wrapper for the Kendo UI OrgChart widget.

组织结构图是一个灵活的组织结构图组件，用于表示组织的结构。组织图可以说明公司、部门、团队或其他层次结构中的层次结构。

• OrgChart HtmlHelper的演示页面

基本配置

下面的示例演示了OrgChart组件的基本配置。

@(Html.Kendo(). orgchart () . name ("orgchart") . dataSource (dataSource => dataSource . read (read => read。行动(“读”,“家”)得(m = > {m.Id (f = > f.ID);m.ParentId(f => f. parentid);m.Name(f =>);m.Title(f => f. title);m.Avatar(f => f. avatar);f. expanded (f =>);}))

公共JsonResult读([DataSourceRequest] DataSourceRequest请求){列表< OrgChartEmployeeViewModel > data =新列表< OrgChartEmployeeViewModel >(){新OrgChartEmployeeViewModel () {ID = 1, Name = " Clevey Thrustfield”,Title =“首席执行官”,ParentID = null,扩大= true,《阿凡达》= " . . /内容/ web / orgchart /人/ 1. jpg”},新OrgChartEmployeeViewModel () {ID = 2,名称=“肖恩·拉塞尔,Title =“财务经理”,ParentID = 1,扩大= true,《阿凡达》= " . . /内容/ web / orgchart /人/ 2. jpg”},new OrgChartEmployeeViewModel() {ID = 3，名称=“Andrew Berry”，Title =“Team Lead”，ParentID = 1，扩展= true，头像=“../content/web/orgchart/people/3.jpg”}，new OrgChartEmployeeViewModel() {ID = 4，名称=“Dilyana Newman”，标题=“会计师”，ParentID = 2，扩展= false，头像=“../content/web/orgchart/people/4.jpg”}};返回Json(data, JsonRequestBehavior.AllowGet);｝

功能和特性

• 绑定
• 编辑
• 分组
• 模板
• 可访问性

事件

你可以订阅所有的组织图表事件．有关组织图事件的完整示例，请参阅组织图表事件演示．

下面的示例演示如何通过处理程序名称订阅事件。

@(Html.Kendo(). orgchart (). name ("orgchart") . events (e => e . select ("onSelect") . change ("onChange")))