Kendo Grid многократный выбор максимального количества строк

Question

Мы используем Kendo Grid(Asp.Net Mvc) для таблицы задач пользователей. Пользователи будут выбирать до 10 задач и запускать операцию с помощью кнопки, расположенной в нижней части сетки. Нам нужно ограничить максимальный выбор строк.Мы установили режим выбора GridSelectionMode.Multiple.

    @(Html.Kendo().Grid<TaskModel>()
    .Name("TaskModelGrid")
    .Selectable(s => s.Mode(GridSelectionMode.Multiple))
    .Columns(columns =>
    {
        columns.Bound(c => c.TaskName);
        ...
    })
    .HtmlAttributes(new { style = "height: 550px;" })
    .Scrollable()
    .Groupable()
    .Sortable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("GetUsersTask", "TaskController"))
        .PageSize(20)
    )
)

Существуют ли какие-либо настройки или способы их использования?Мы проверили документацию, но ничего не нашли. Любые идеи будут оценены.Спасибо за помощь.

Answer 1

Kendo не имеет встроенной поддержки для максимального количества выбранных строк.Используйте событие Change, чтобы перехватить массив выбранных строк и отменить выбор дополнительных строк.Основной рабочий код следующий: пользователь может выбрать максимум 10 строк:

.cshtml

.Events(e=> e.Change("onRowChange"))

---

function onRowChange(e)
{
    /* get all the selected rows */
    var items = e.sender.select();
    items.each(function(i, e) {
      /* allows user to select 10 rows max */
      if (i > 9) {
        $(e).removeClass("k-state-selected");
      }
    });
}

Посмотрите демонстрационную версию fiddle .

Answer 2

Могу поспорить, что вы могли бы сделать это с помощью проверки количества событий в сетке:

....

.Events(e=> e.Change("onGridRowChange"))

...
function onGridRowChange()
{
    var grid = $('#grdMyGrid').data('kendoGrid');
    var selectedRows = grid.select();
    console.log(selectedRows.length);
}