最近遇到一个需求需要动态把grid复选框列变成单选框，先上复选grid代码

查询了kendoUI的官方文档得到解释

查询大佬们博客发现：
selectable ：Boolean | String 选中表格的设置，默认false禁止选中，字符串‘row’表示可以选中一行，‘cell’ 表示可以选中一列，‘multiple, row’表示可以选中多行，‘multiple, cell’表示可以选中多列。

所以当时想利用这个属性，来进行动态变化。

方案一? ?通过动态改变grid的selectable属性并重新加载grid来实现复选变单选。

var??selectCheckBox = "multiple,rowbox";

用一个全局变量selectCheckBox来动态改变 grid 属性 selectable: selectCheckBox，

function changeBox(type) {

????if (type == xxx) {

? ? ? ? return "multiple,rowbox”;

????} else {

? ? ? ? return "single,rowbox";

????}

}

用一个函数方法来动态改变 grid 属性 selectable: changeBox(type)，

结果发现selectable属性只会在页面载入时候取一次值或者调用一次function函数，后续就算改变全局变量和手动刷新grid也无法触发函数重新调用。我尝试使用$('#company_grid').data('kendoGrid').dataSource.page(1) 和 $('#company_grid').data('kendoGrid').refresh() 去触发grid重新加载，间接重新加载grid的selectable属性，发现没有效果，假如有可以实现重新加载selectable属性的方法请留言告知我，万分感谢！。

方案二? 给复选框绑定点击事件，通过控制事件让勾选失效达到复选变单选。

给grid的标题行复选框增加点击事件，使其失去勾选功能。

$("#company_grid thead>tr th span.k-checkbox").click(function (e) {

? ? return false;

});

给grid的明细行增加绑定事件,但是我一直没有给明细行前复选框绑定上点击事件，在函数中增加console.log()也没有打印。

$("#company_grid tbody td.k-checkbox").click(function (e) {

? ? return false;

});

通过谷歌浏览器查看Jquery选择器能否获取到复选框，发现已获取到，但是仅仅是标题行的有效果，明细行一直没效果。笔者也一直没找到起因，假如有人知道也请留言告知，再次感谢！。

方案三? 因为前面方案总是棋差一招，只能剑走偏锋。创立两个grid一个selectable属性是多选，另一个grid的selectable属性是单选。两个grid同时绑定一个数据源，保证数据统一，根据选择条件隐藏一个，显示一个。

至此单复选框的动态切换就实现了，这种实现方式比较Low但是效果达到了，假如有大佬有好的实现方式，请留言告知。

参考文章链接：

官方文档

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.selectable

博客文档

https://blog.csdn.net/qq_35611143/article/details/81485551