具有可编辑枚举列的 Kendo MVC 网格

Posted 2023-05-07

【中文标题】具有可编辑枚举列的 Kendo MVC 网格

【英文标题】：Kendo MVC grid with editable enum column

【发布时间】：2015-09-26 12:35:22

【问题描述】：

我有一个简单的模型，需要在 Kendo 的 MVC Grid 组件中显示和编辑。

public class MyModel

    public int Id get; set;
    public string SomeProperty get; set;
    public MyEnum MyEnum get; set;


public enum MyEnum

    FirstItem = 1,
    SecondItem = 2,
    ThirdItem = 3

我的网格设置如下：

@(html.Kendo()
    .Grid<MyModel>()
    .Name("grid").Columns(columns =>
    
        columns.Bound(o => o.SomeProperty).Width(200);
        columns.Bound(o => o.MyEnum).Width(200);
        columns.Command(command =>
        
            command.Edit().Text("Edit");
        ).Width(220);
    )
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(false)
        .ServerOperation(false)
        .Model(model =>
        
            model.Id(p => p.Id);
            model.Field(p => p.SomeProperty);
            model.Field(p => p.MyEnum);

        )
        .Create(...) // removed for confidentiality
        .Read(...)
        .Update(...)
        .Events(...)
    ).Filterable()
  .Sortable())

执行编辑命令后，我在Update(...) 中定义的控制器方法中收到更新的模型。

public virtual async Task<ActionResult> Update(
        [DataSourceRequest] DataSourceRequest request,
        MyModel myModel)

但是无论我做什么，控制器中的myModel 的默认值都是MyEnum。即使我只更改将MyEnum 设置为SecondItem 的项目的SomeProperty，它也会在控制器中为FirstItem。这已通过查看 POST 请求得到验证，因此问题出在网格中的某处，而不是服务器上。

如何进行正确的数据绑定以确保 Kendo 发送正确的MyEnum 值？

【参考方案1】：

我遇到了同样的问题。您应该对 MyEnum 属性使用 EditorTemplate（Shared\EditorTemplates 文件夹中的 MyEnum.cshtml）：

@model MyEnum

@(Html.Kendo().DropDownListFor(m => m)
   .Name("MyEnum")
   .BindTo(EnumHelper.GetSelectList(Model.GetType()))
   .OptionLabel("Please select MyEnum"))

【参考方案2】：

您需要在列上使用.ForeignKey() 而不是绑定：

@(Html.Kendo()
    .Grid<MyModel>()
    .Name("grid").Columns(columns =>
    
        columns.ForeignKey(o => o.MyEnum, ).EditorTemplateName("GridForeignKey").Width(200);

        // SNIP

然后像这样在Views/Shared/EditorTemplate 中定义GridForeignKey.cshtml：

@model object

@
    var selectList = (SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"];


@Html.DropDownListFor(m => m, selectList, "Choose...")

这样您可以在网格中获得一个下拉菜单，并在 POST 上将正确的值输入到您的控制器中。

【参考方案3】：

您的模型中可能存在冲突，因为您的枚举对象属性与类型匹配。建议你把它重命名为这样，试试看；

public class MyModel

    public int Id get; set;
    public string SomeProperty get; set;
    public MyEnum EnumProperty get; set;