Question

我正在使用Kendo UI for ASP.NET Core。我使用的是Kendo Grid，需要以下功能才能工作：排序，过滤，编辑（带单元格中的客户组合框）。事实证明，编辑模板需要复杂视图模型才能按照this documentation工作，但复杂的视图模型会破坏网格的排序和过滤功能。由于网格尝试对对象进行排序和搜索而不是单个字段。

我有一个类似于以下内容的ViewModel：

public class ProjectViewModel
{
    public int Id { get; set; }
    public string Name { get; set; }

    [UIHint("CustomersEditor")]
    public CustomerViewModel Customer { get; set; }
}

我使用它作为我的剑道网格的模型：

@(Html.Kendo().Grid(Model)
      .Name("grid")
      .Columns(columns =>
      {
          columns.Bound(c => c.Customer).Title("Customer").ClientTemplate("#= Customer.Name#");
          columns.Command(command => { command.Edit(); command.Destroy(); }).Width(300);
      })
      .Editable(editable => editable.Mode(GridEditMode.InLine))
      .Sortable()
      .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
      .Pageable(pageable => pageable
          .Refresh(true)
          .PageSizes(true)
          .ButtonCount(5))
      .DataSource(dataSource => dataSource
          .Ajax()
          .PageSize(20)
          .Model(model =>
          {
              model.Id(item => item.Id);
          })
          .Create(update => update.Action("Projects_Create", "Projects"))
          .Read(read => read.Action("Projects_Read", "Projects"))
          .Update(update => update.Action("Projects_Update", "Projects"))
          .Destroy(update => update.Action("Projects_Destroy", "Projects"))
      )
      )

如您所见，我将属性Customer指定为绑定列，并在不处于编辑模式时将客户端模板设置为Customer.Name。

我将列属性设置为Customer对象的原因是因为当网格处于编辑模式时，我在此列中使用了ComboBox编辑器模板。我相信这是唯一的方法as per this documentation。

@(Html.Kendo().ComboBoxFor(x => x)
    .Placeholder("Select a customer...")
    .DataValueField("Id")
    .DataTextField("Name")
    .BindTo((List<CustomerViewModel>)ViewData["customers"])
)

通过上述设置，除了由于Customer列而导致排序/过滤被破坏之外，一切都有效。

因为我认为我无法告诉网格使用Customer.Name进行排序/过滤而不是客户。无论如何我仍然可以使用平面视图模型实现ComboBox编辑器模板吗？

Answer 1

尝试将“ columns.Bound（c => c.Customer）”更改为column.Bound（c => c.Customer.Name）

由于“名称”是一种简单的类型，因此可以进行过滤和排序。

在“编辑器模板”组合框中，将其命名为“客户”，因此.Name（“客户”）

这对我有用，我遇到了与您完全相同的问题，遵循了Telerik关于编辑器模板的文档，但是排序/过滤失败了。如果它对您有用，那么我90％肯定是因为kendo框架将DataValueField“ Id”匹配到Customer列对象的“ Id”属性，即使您将Customer.Name本身指定为绑定字段。

Answer 2

不是你可能想听到的答案，但如果你改变了

ng-package.json

到

.Filterable(ftb => ftb.Mode(GridFilterMode.Row))

过滤应该有效。我认为这是一个错误，但在他们的支持团队回复我之前不会知道。

使用具有Kendo UI网格的Complex ViewModel时，排序和过滤会中断

2 个答案: