Telerik UI for ASP。网络核心下载30天免费试用

数据绑定

默认情况下,Telerik UI Gantt for ASP。NET Core执行服务器端请求(HTTP得到)进行分页、排序和过滤。

您还可以呈现带有任务和依赖项数据的视图。你必须实现IGanttTaskIGanttDependency的数据模型中的接口GanttTasksGanttDependencies分别。

设置数据模型类

您可以通过使用任务和依赖项的数据模型类来绑定甘特。

属性绑定甘特函数,下面的示例演示如何通过TaskViewModel

公共类TaskViewModel: iganttask{公共int TaskID {get;设置;} //ParentID应该是空的:public int?ParentID {get;设置;}公共字符串标题{获取;设置;}私有DateTime开始;public DateTime Start {get{返回开始;} set {start = value.ToUniversalTime(); } } private DateTime end; public DateTime End { get { return end; } set { end = value.ToUniversalTime(); } } public bool Summary { get; set; } public bool Expanded { get; set; } public decimal PercentComplete { get; set; } public int OrderId { get; set; } public GanttTask ToEntity() { return new GanttTask { ID = TaskID, ParentID = ParentID, Title = Title, Start = Start, End = End, Summary = Summary, Expanded = Expanded, PercentComplete = PercentComplete, OrderID = OrderId }; } }

属性绑定甘特函数,下面的示例演示如何通过DependencyViewModel

公共类DependencyViewModel: IGanttDependency {public int DependencyID {get;设置;} public int id {get;设置;} public int SuccessorID{获取;设置;} public DependencyType类型{get;设置;} public GanttDependency ToEntity() {return new GanttDependency {ID = DependencyID, ID = ID, SuccessorID = SuccessorID, Type = (int)Type};}}

绑定到ViewData中的项

属性将甘特函数绑定到项上显示数据配置。

public IActionResult ServerBinding() {var sampleEntities = new sampleEntities ();ViewData["tasks"] = sampleEntities。GanttTasks .ToList()。选择(task => new TaskViewModel {TaskID = task。ID, Title =任务。Title, Start = datetime . specifickind(任务。开始,DateTimeKind.Utc),结束= datetime . specifickind(任务。结束,DateTimeKind.Utc), ParentID =任务。ParentID, PercentComplete =任务。PercentComplete, OrderId =任务。OrderID, Expanded =任务。展开,Summary = task。摘要}).AsQueryable ();ViewData["dependencies"] = sampleEntities。GanttDependencies .ToList()。选择(dependency => new DependencyViewModel {DependencyID = dependency. model)。ID, ID =依赖。前任id,成功id =依赖。SuccessorID, Type = (DependencyType)依赖项。类型}).AsQueryable (); return View(); }
@(Html.Kendo() . gantt ((IEnumerable)ViewData["tasks"], (IEnumerable)ViewData["dependencies"]) . name ("gantt") . columns (columns => {columns。Bound(c => c. taskid).Title("ID").Width(50);columns.Bound(“标题”).Editable(真正的).Sortable(真正的);columns.Bound(“开始”)。标题(“开始时间”).Format(“{0:MM / dd / yyyy}”).Width (100) .Editable(真正的).Sortable(真正的);columns.Bound(“结束”)。标题(“结束时间”).Format(“{0:MM / dd / yyyy}”).Width (100) .Editable(真正的).Sortable(真正的);}) .Editable(false) .Height(400) .DataSource(d => d .Model(m => {m.d id (f => f.s askid);m.ParentId(f => f. parentid);m.OrderId(f => f. orderid);(f =>).DefaultValue(true); }) ) .DependenciesDataSource(d => d .Model(m => { m.Id(f => f.DependencyID); m.PredecessorId(f => f.PredecessorID); m.SuccessorId(f => f.SuccessorID); m.Type(f => f.Type); }) ) )

绑定到ViewBag中的项目

属性将甘特函数绑定到项上ViewBag配置。

public IActionResult ServerBinding() {var sampleEntities = new sampleEntities ();ViewBag。Tasks = sampleEntities。GanttTasks .ToList()。选择(task => new TaskViewModel {TaskID = task。ID, Title =任务。Title, Start = datetime . specifickind(任务。开始,DateTimeKind.Utc),结束= datetime . specifickind(任务。结束,DateTimeKind.Utc), ParentID =任务。ParentID, PercentComplete =任务。PercentComplete, OrderId =任务。OrderID, Expanded =任务。展开,Summary = task。摘要}).AsQueryable ();ViewBag。Dependencies = sampleEntities。GanttDependencies .ToList()。选择(dependency => new DependencyViewModel {DependencyID = dependency. model)。ID, ID =依赖。PredecessorID, SuccessorID = dependency.SuccessorID, Type = (DependencyType)dependency.Type }).AsQueryable(); return View(); }
@(Html.Kendo() . gantt ((IEnumerable)ViewBag. ()任务,(IEnumerable)ViewBag.Dependencies) . name ("gantt") . columns (columns => {columns. dependencies)。Bound(c => c. taskid).Title("ID").Width(50);columns.Bound(“标题”).Editable(真正的).Sortable(真正的);columns.Bound(“开始”)。标题(“开始时间”).Format(“{0:MM / dd / yyyy}”).Width (100) .Editable(真正的).Sortable(真正的);columns.Bound(“结束”)。标题(“结束时间”).Format(“{0:MM / dd / yyyy}”).Width (100) .Editable(真正的).Sortable(真正的);}) .Editable(false) .Height(400) .DataSource(d => d .Model(m => {m.d id (f => f.s askid);m.ParentId(f => f. parentid);m.OrderId(f => f. orderid); m.Field(f => f.Expanded).DefaultValue(true); }) ) .DependenciesDataSource(d => d .Model(m => { m.Id(f => f.DependencyID); m.PredecessorId(f => f.PredecessorID); m.SuccessorId(f => f.SuccessorID); m.Type(f => f.Type); }) ) )

Razor Page场景中的绑定

为了建立Telerik的用户界面,Gantt HtmlHelper为ASP。网络核心component in Razor page scenario, you need to configure the创建更新摧毁方法数据源DependenciesDataSource实例。这些方法中的URL应该引用PageModel中处理程序的名称。在此方法中,还可以传递其他参数,例如防伪造令牌(请参阅forgeryToken).参见下面示例中的实现细节,对于RazorPages示例的完整项目,请访问我们的GitHub库

@inject microsoft . aspnetcore . antiforge . iantiforgery Xsrf @ html . antiforgerytoken () @(Html.Kendo()。Gantt() . name (" Gantt ") . columns (columns => {columns。Bound(c => c. taskid).Title("ID").Width(80);列。Bound(c => c. title).Width(250).Editable(true).Sortable(true);列。Bound(c => c. start).Width(150).Editable(true).Sortable(true);列。绑定(c => c. end).Width(150).可编辑(true).可排序(true);views (views => {views. dayview ();的观点。WeekView(WeekView => WeekView . selected (true)); views.MonthView(); }) .Height(700) .ShowWorkHours(false) .ShowWorkDays(false) .Snap(false) .DataSource(d => d .Model(m => { m.Id(f => f.TaskID); m.ParentId(f => f.ParentID); m.Field(f => f.Expanded).DefaultValue(true); m.Field(f=>f.TaskID); }) .Read(r => r.Url("/Gantt/GanttIndex?handler=Read").Data("forgeryToken")) .Create(r => r.Url("/Gantt/GanttIndex?handler=Create").Data("forgeryToken")) .Update(r => r.Url("/Gantt/GanttIndex?handler=Update").Data("forgeryToken")) .Destroy(r => r.Url("/Gantt/GanttIndex?handler=Destroy").Data("forgeryToken")) ) .DependenciesDataSource(d => d .Model(m => { m.Id(f => f.DependencyID); m.PredecessorId(f => f.PredecessorID); m.SuccessorId(f => f.SuccessorID); }) .Read(r => r.Url("/Gantt/GanttIndex?handler=DependenciesRead").Data("forgeryToken")) .Create(r => r.Url("/Gantt/GanttIndex?handler=DependenciesCreate").Data("forgeryToken")) .Update(r => r.Url("/Gantt/GanttIndex?handler=DependenciesUpdate").Data("forgeryToken")) .Destroy(r => r.Url("/Gantt/GanttIndex?handler=DependenciesDestroy").Data("forgeryToken")) ) ) 
public JsonResult OnPostRead([DataSourceRequest] DataSourceRequest request){返回新的JsonResult(tasks.ToDataSourceResult(request));} public JsonResult OnPostCreate([DataSourceRequest] DataSourceRequest请求,TaskViewModel任务){任务。TaskID = guide . newguid ().ToString();if (ModelState.IsValid) {tasks.Add(任务);}返回新的JsonResult(new[] {task}. txt)。ToDataSourceResult(请求状态));} public JsonResult OnPostUpdate([DataSourceRequest] DataSourceRequest请求,TaskViewModel任务){int index = tasks. indexof(任务。FirstOrDefault(item =>{返回项目。TaskID == task.TaskID;}));task [index] = task;return new JsonResult(new[] {task}.)ToDataSourceResult(请求状态)); } public JsonResult OnPostDestroy([DataSourceRequest] DataSourceRequest request, TaskViewModel task) { int index = tasks.IndexOf(tasks.FirstOrDefault(item => { return item.TaskID == task.TaskID; })); tasks.RemoveAt(index); return new JsonResult(new[] { task }.ToDataSourceResult(request, ModelState)); } public JsonResult OnPostDependenciesRead([DataSourceRequest] DataSourceRequest request) { return new JsonResult(dependencies.ToDataSourceResult(request)); } public JsonResult OnPostDependenciesCreate([DataSourceRequest] DataSourceRequest request, DependencyViewModel dependency) { if (ModelState.IsValid) { dependencies.Add(dependency); } return new JsonResult(new[] { dependency }.ToDataSourceResult(request, ModelState)); } public JsonResult OnPostDependenciesUpdate([DataSourceRequest] DataSourceRequest request, DependencyViewModel dependency) { int index = dependencies.IndexOf(dependencies.FirstOrDefault(item => { return item.DependencyID == dependency.DependencyID; })); dependencies[index] = dependency; return new JsonResult(new[] { dependency }.ToDataSourceResult(request, ModelState)); } public JsonResult OnPostDependenciesDestroy([DataSourceRequest] DataSourceRequest request, DependencyViewModel dependency) { int index = dependencies.IndexOf(dependencies.FirstOrDefault(item => { return item.DependencyID == dependency.DependencyID; })); dependencies.RemoveAt(index); return new JsonResult(new[] { dependency }.ToDataSourceResult(request, ModelState)); }

另请参阅

在本文中
Baidu
map