我有一个Kendo Grid,我希望一次只能扩展一行进行细节编辑.最简单的方法是什么？
- @(Html.Kendo().Grid<MyModel>()
- .Name("MyGrid")
- .ClientDetailTemplateId("MyTemplate")
- .Columns(columns =>
- {
- columns.Bound(b => b.Code);
- columns.Bound(b => b.Name);
- columns.Bound(b => b.Description);
- ...
- columns.Command(cmd => { cmd.Edit(); cmd.Destroy(); });
- })
- .ToolBar(toolbar => toolbar.Create())
- .Editable(editable => editable.Mode(GridEditMode.InLine))
- .DataSource(dataSource => dataSource
- .Ajax()
- .Model(model => model.Id(a => a.Id))
- .Create(create => create.Action("Create","SysMaint",new { id = Model.ProjectId }))
- .Read(read => read.Action("Read",new { projectId = Model.ProjectId }))
- .Update(update => update.Action("Update","SysMaint"))
- .Destroy(destroy => destroy.Action("Destroy","SysMaint"))
- )
- )
- <script id="MyTemplate" type="text/kendo-tmpl">
- @(Html.Kendo().TabStrip()
- .Name("TabStrip_#=Id#")
- .SelectedIndex(0)
- .Items(items =>
- {
- items.Add().Text("A").LoadContentFrom("MyPartialA",new { id = "#=Id#" });
- items.Add().Text("B").LoadContentFrom("MyPartialB",new { id = "#=Id#" });
- })
- .ToClientTemplate()
- )
- </script>
解决方法
结束这很简单.只需添加这几行.
- ...
- .Update(update => update.Action("Update","SysMaint"))
- )
- .Events(events => events.DetailExpand("detailExpand"))
- )
- <script type="text/javascript">
- var expandedRow;
- function detailExpand(e) {
- // Only one open at a time
- if (expandedRow != null && expandedRow[0] != e.masterRow[0]) {
- var grid = $('#MyGrid').data('kendoGrid');
- grid.collapseRow(expandedRow);
- }
- expandedRow = e.masterRow;
- }
- </script>
我希望这有助于某人.
