Почему настроенный флажок не отображается в Kendo Grid - PullRequest
0 голосов
/ 21 февраля 2020

Я добавляю свои настраиваемые флажки в сетку кендо, но она отображается не во всех браузерах.

вот изображение broken checkboxes

Здесь моя сетка

 @(Html.Kendo().Grid<Days>()
       .Name("timegrid")
       .DataSource(d => d.Ajax().Read("DayGrid", "Day").Model(keys =>
       {
           keys.Id(k => k.DayId);
           keys.Field(c => c.DayName).Editable(false);
           keys.Field(c => c.DayId).Editable(false);
       }).PageSize(7))
                       .Columns(c =>
                       {
                           c.Bound(p => p.DayId).Width(100).Title(" ").Template(templateAction => templateAction.DayId).ClientTemplate("#= chk2(data) #").Sortable(false);
                           c.Bound(e => e.DayName).Width("auto").Title("Day");
                       })
        )

Я использую шаблон клиента вот оно

function chk2(data) {
    return '<label class="tree-node-selector"><input type="checkbox"/><i class="fa tree-node-icon"></i></label>';

}

Как я могу решить эту проблему?

1 Ответ

0 голосов
/ 25 февраля 2020

Я нашел ответ здесь, я хочу поделиться им.

Здесь моя сетка

@( Html.Kendo().Grid<MockUpForeNet.Controllers.CardDetailController.Days>()
 .Name("timegrid")
 .DataSource(d => d.Ajax().Read("TimeGridBinding", "CardDetail").Model(keys =>
 {
     keys.Id(k => k.DayId);
     keys.Field(c => c.DayName).Editable(false);
     keys.Field(c => c.DayId).Editable(false);
 }).PageSize(7))
           .Columns(c =>
           {
               c.Bound(p => p.DayId).Width(100).Title(" ").ClientTemplate("#= chk2(data) #").Sortable(false);
               c.Bound(e => e.DayName).Width("auto").Title("Day");
           })
   .Editable(editing => editing.Mode(Kendo.Mvc.UI.GridEditMode.InCell))
   .Sortable()
   .ColumnMenu()
)

Здесь мой шаблон клиента

function chk2(data) {
    return '<input id="masterCheck' + data.DayId + '" class="k-checkbox" type="checkbox" checked="checked" /><label for="masterCheck" class="k-checkbox-label"></label>';
}
...