Сортировка и фильтрация прерываются при использовании сложной ViewModel с сеткой пользовательского интерфейса Kendo.

Я использую Kendo UI для ASP.NET Core. Я использую Kendo Grid, и мне нужны следующие функции для работы: сортировка, фильтрация, редактирование (со списком клиентов в ячейке). Оказывается, вам нужна модель сложного представления, чтобы шаблон редактора работал в соответствии с эту документацию, но сложная модель представления нарушает функциональность сортировки и фильтрации сетки. Поскольку сетка пытается сортировать и искать объект вместо одного поля.

У меня есть 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 внутри этого столбца, когда сетка находится в режиме редактирования. Я считаю, что это единственный способ сделать это согласно этой документации.

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

С приведенной выше настройкой все работает, за исключением того факта, что сортировка/фильтрация не работает из-за столбца «Клиент».

Поскольку я считаю, что я никак не могу указать сетке использовать Customer.Name для сортировки/фильтрации вместо Customer. Могу ли я в любом случае получить шаблон редактора ComboBox с плоской моделью представления?


person Blake Rivell    schedule 10.01.2018    source источник


Ответы (2)


Попробуйте изменить "columns.Bound(c => c.Customer)" на columns.Bound(c => c.Customer.Name)

Это заставит фильтрацию и сортировку работать, потому что «Имя» является простым типом.

В поле со списком шаблонов редактора дайте ему имя «Клиент», поэтому .Name («Клиент»)

Это сработало для меня, и у меня была точно такая же проблема, как и у вас, я следил за документацией Telerik для шаблонов редактора, но сортировка/фильтрация не удалась. Если это работает для вас, я на 90% уверен, что это потому, что фреймворк кендо сопоставляет DataValueField «Id» со свойством «Id» объекта столбца Customer, ДАЖЕ ЕСЛИ вы указываете Customer.Name как связанное поле.

person Francisco Javier Ramos    schedule 16.07.2018

Не тот ответ, который вы, возможно, захотите услышать, но если вы измените

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

введите здесь описание изображения

to

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

введите здесь описание изображения

Фильтрация должна работать. Я думаю, что это ошибка, но не узнаю, пока их служба поддержки не свяжется со мной.

person Geovani Martinez    schedule 03.05.2021