5

我有一个 MVC 3 项目,我在其中经常使用 Kendo UI Grid。

典型的视图如下所示:

@using Kendo.Mvc.UI
@model List<ActionViewModel>
@(Html.Kendo().Grid<ActionViewModel>()
.Name("#grid")    
.Columns(columns =>
    {
        columns.Bound(p => p.Name);
        columns.Command(command => { command.Edit(); command.Destroy(); });
})
.ToolBar(toolbar => toolbar.Create().Text(Resources.Grid.Create))
.Editable(editable => editable.Mode(GridEditMode.PopUp)))
.Sortable()
.Scrollable()
.Filterable(f=>f.Extra(true))
.DataSource(dataSource => dataSource        
    .Ajax() 
    .Events(events => events.Error("error_handler"))
    .Model(model => model.Id(p => p.Id))
    .Create(update => update.Action("Create", "Action"))
    .Read(read => read.Action("Read", "Action"))
    .Update(update => update.Action("Update", "Action"))
    .Destroy(update => update.Action("Delete", "Action"))
))

我经常需要为我的视图模型定义自定义编辑器模板,这些模板用于 Kendo UI 的编辑弹出窗口。

在 Kendo UI Grid 中,可以创建、更新和删除元素。默认情况下,编辑和创建的弹出窗口使用相同的编辑器模板。有没有一种简单的方法可以让两个单独的编辑器模板用于编辑和删除?

4

1 回答 1

8

更新

为了防止对一个 4 岁的答案进行不必要的否决,我在下面的评论中包括了@ataravati 提供的问题。去这里寻找更好、更现代的答案:Kendo UI 网格 - 用于编辑和创建的不同模板

旧答案

这不是 C# 答案,但它是相关的。我使用 JavaScript API 并设法找出一种方法来区分“添加”和“编辑”,并让弹出编辑器对每个做出不同的反应。我的理由是,在添加新条目时,所有字段都是可编辑的,但在编辑现有条目时,我需要将某些字段设为只读。

简而言之,我为工具栏按钮添加了一个 jQuery 单击侦听器,并使用一组 if 语句来确定单击的按钮是否具有k-grid-editork-grid-add类(或自定义类,如果我在我的 Grid 小部件中使用自定义工具栏按钮)。然后,我将操作类型(“添加”或“编辑”)存储在父网格的数据属性中:

$("#grid").data("action","add");

...然后我在自定义弹出编辑器模板中阅读,以确定某些字段是否应该是只读的:

if ($("#grid").data("action") === "add") { /*Do stuff*/ }

我还使用此方法根据情况隐藏或显示工具栏按钮(例如,在内联编辑器模式下,保存和取消按钮应该只在一行处于编辑模式时可见,因此当用户在网格并单击“编辑”按钮,默认隐藏的“保存”和“取消”按钮会显示出来,而其他按钮则被隐藏。一旦“编辑”操作完成并且用户单击“保存”或“取消”,按钮就会切换回初始状态状态)。

有关更明确的信息,这是我关于该主题的 Kendo UI 论坛帖子:

http://www.kendoui.c​​om/forums/ui/grid/kendo-grid---how-to-have-different-custom-editor-for-update-and-create.aspx

我发布了一些示例代码,另一个名为 Philipp 的用户提出了一个不同的解决方案,该解决方案得到了相同的最终结果,并发布了他的代码。

所以,回答你的问题:

不,没有简单的方法。该功能目前不包含在 Kendo UI 框架中。但是,仍然可以使用一点额外的肘部油脂。或者咖啡因。:)

我希望这是有帮助的。

于 2012-10-03T19:15:39.477 回答