Пользовательский шаблон строки / флажка для сетки Kendo UI

Question

Я пытаюсь создать собственный шаблон строки для сетки пользовательского интерфейса Kendo, который включает в себя функцию флажка. У меня есть сетка, созданная так:

@(Html.Kendo().Grid(Model.Users)
              .Name("usersGrid")
              .Columns(columns =>
              {
                  columns.Select().Width(50);
                  columns.Bound(c => c.UserName);
              })
              .DataSource(dataSource => dataSource
                  .Ajax()
                  .ServerOperation(false))
              .ClientRowTemplate(UsersClientTemplate))

С функцией для генерации шаблона строки следующим образом:

Func<Grid<User>, string> UsersClientTemplate = (grid) =>
{
    var id = Guid.NewGuid();
    return @"<tr data-uid='#:uid#' role='row'>" +
           "<td role='gridcell'>" +
           $"<input class='k-checkbox' data-role='checkbox' type='checkbox' id={id}>" +
           $"<label class='k-checkbox-label k-no-text' for={id}>​</label>" +
           "</td>" +
           "<td role='gridcell'>" +
           "<a href='/users/details/#:data.Id#'>#:data.UserName#</a>" +
           "</td>" +
           "</tr>";
};

Проблема в том, что я не могу понять, как сгенерировать уникальные идентификаторы для шаблона каждой строки. Если я не включу атрибут id в элемент checkbox input и атрибут for в элемент checkbox label, выбор флажка / строки не будет работать. Но с помощью функции, описанной выше, один и тот же идентификатор генерируется для каждого шаблона строки, и тогда выбор флажка / строки работает, очевидно, только для первой строки.

Какой лучший способ сделать это?

Answer 1

Шаблоны генерируются при построении сетки, так как вы видели, что идентификатор всегда одинаков.Вам нужно привязать данные, чтобы кендо заменял идентификатор каждой записи.Я использую свой ключ сущности с префиксом типа "cb_" для флажка:

       $"<input class='k-checkbox' data-role='checkbox' type='checkbox' id='cb_#:uid#'>" +
       $"<label class='k-checkbox-label k-no-text' for='cb_#:uid#'>​</label>" +