使 k-checkbox 在 Kendo UI 网格中可见

Question

使用行数据模板或使用 HTML 作为字段值的列标题模板，我可以向 Kendo UI 网格添加一个复选框。例如：

  <div id="grid"></div>
  <script>
    $(document).ready(function() {
        $("#grid").kendoGrid({
        columns: [{
            field:'<input id="masterCheck" type="checkbox" /><label for="masterCheck"></label>', 
          width: 33,  
          height: 550,
            }] 
        });
      });
    </script>

但是，该复选框的样式并不符合 Kendo UI 主题。将 class="k-checkbox" 添加到输入复选框元素应根据主题设置其样式。但是，当我将该类应用于复选框时，该复选框不再可见。如何让 k 复选框在网格中可见？

该问题的示例位于http://dojo.telerik.com/AjuFo

Answer 1

您已将“k-checkbox”类添加到复选框，但忘记将“k-checkbox-label”类添加到标签中。这就是为什么在将“k-checkbox”类应用于输入元素后它不显示的原因。

请尝试使用下面的代码片段。

<script>
    $(document).ready(function() {
        $("#grid").kendoGrid({
        columns: [{
            field:'<input id="masterCheck" class="k-checkbox" type="checkbox" /><label for="masterCheck" class="k-checkbox-label"></label>', 
          width: 33,  
          height: 550,
            }] 
        });
      });
    </script>

如果有任何疑问请告诉我。