弹出窗口在 Kendo UI 网格中的工作原理以及如何在 MVC4 的 Kendo UI ajax 网格中将控件带入弹出窗口
Posted
技术标签:
【中文标题】弹出窗口在 Kendo UI 网格中的工作原理以及如何在 MVC4 的 Kendo UI ajax 网格中将控件带入弹出窗口【英文标题】:How the pop up works in the KendoUI grid and how to bring the controls in the pop up in KendoUI ajax grid for MVC4 【发布时间】:2013-01-17 15:39:05 【问题描述】:单击编辑按钮时弹出窗口的工作原理以及如何将三个Combobox带入弹出窗口。我真的对下面的代码感到困惑
Client side Code
//show server errors if any
function error_handler(e)
if (e.errors)
var message = "Errors:\n\n";
$.each(e.errors, function (key, value)
if ('errors' in value)
$.each(value.errors, function ()
message += this + "\n\n";
);
);
alert(message);
@(html.Kendo().Grid(Model)
.Name("SchoolGrid")
.Columns(columns =>
columns.Bound(p => p.SchoolID).Width("80px");
columns.Bound(p => p.Name);
columns.Bound(p => p.Campus).Width("90px");
columns.Bound(p => p.StateCode).Width("90px");
columns.Bound(p => p.SectorCode).Width("95px");
columns.Bound(p => p.MDISurveyStartDate).ClientTemplate("#= (MDISurveyStartDate == null) ? 'Not Set' : kendo.toString(MDISurveyStartDate, 'dd/MM/yyyy') #").Width("90px");
columns.Bound(p => p.MDISurveyEndDate).ClientTemplate("#= (MDISurveyEndDate == null) ? 'Not Set' : kendo.toString(MDISurveyEndDate, 'dd/MM/yyyy') #").Width("90px");
columns.Command(command => command.Edit(); command.Destroy(); ).Width("190px").HtmlAttributes(new style = "text-align:center" );
)
.ToolBar(tb => tb.Create().Text("Add New School"))
.Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("EditSchool").Window(w => w.Title("Add/Edit School Details").Name("editWindow").Width(600)))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(p => p.ClientID))
.Events(e => e.Error("error_handler"))
.Read("Read_Schools", "School")
.Update("Update", "School")
.Create("Create", "School")
.Destroy("Destroy", "School")
)
)
Server Side Code:-
[HttpPost]
public ActionResult Update([DataSourceRequest] DataSourceRequest request, School school)
try
if (ModelState.IsValid)
string errMsg = "";
if (!_Service.UpdateSchool(school, out errMsg))
ModelState.AddModelError("UpdateSchool", errMsg);
catch (Exception ex)
ModelState.AddModelError("UpdateSchool", ex.Message);
return Json(ModelState.ToDataSourceResult());
【问题讨论】:
【参考方案1】:There is code library 显示如何操作 Window 的内容。其余的编辑可以通过 Grid 的 edit 事件进行(查看文档)。
【讨论】:
以上是关于弹出窗口在 Kendo UI 网格中的工作原理以及如何在 MVC4 的 Kendo UI ajax 网格中将控件带入弹出窗口的主要内容,如果未能解决你的问题,请参考以下文章
ASP.NET MVC Kendo UI Edit Popup Internet Explorer Date Edit Problems