自定義復選框在劍道網格中不可點擊

Question

我有帶有復選框選擇列的劍道網格，我自定義了這些復選框，但現在復選框不可點擊，無法取消選中或選中

我該如何解決這個問題？

這是我的代碼

@( 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>';
}

Answer 1

您的模板中有錯誤： label for="masterCheck" data.DayId label for="masterCheck"缺少data.DayId 。

另請注意，復選框在 2020.1.114 版本中已更改，不再需要空標簽。 請參閱https://demos.telerik.com/kendo-ui/checkbox/index 上的示例。 出於可訪問性的原因，請記住提供aria-label 。

Answer 2

DayId應在DataSource設置為可編輯

keys.Field(c => c.DayId).Editable(true);