排序和过滤后，如何重新选中剑道网格中的复选框？答案

【问题标题】：How can I re-check a checkbox in a kendo grid after sorting and filtering?排序和过滤后，如何重新选中剑道网格中的复选框？
【发布时间】：2013-01-06 08:11:38
【问题描述】：

我在剑道网格中的每一行都有一个复选框。如果用户对网格进行排序或过滤，则从复选框中清除复选标记。在排序或过滤发生后，如何防止复选框取消选中或重新选中它们？请参考以下js fiddle观察排序时的行为：

http://jsfiddle.net/e6shF/33/

这是jsfiddle上的代码供参考（......需要问这个问题）：

$('#grid').kendoGrid({
    dataSource: { data: [{id:3, test:'row check box will unchecked upon sorting'}]},
    sortable: true,
    columns:[
{
    field:'<input id="masterCheck" class="check" type="checkbox" /><label for="masterCheck"></label>', 
    template: '<input id="${id}" type="checkbox" />',
    filterable: false,
    width: 33,
    sortable: false // may want to make this sortable later. will need to build a custom sorter.
},
    {field: 'test',
     sortable: true}
]});

【问题讨论】：

标签： sorting grid filtering kendo-ui checkbox

【解决方案1】：

基本上每次都会清除选择，因为重新绘制了网格。您可以将检查项存储在数组或对象中，当重绘 Grid（dataBound 事件）时，您可以再次将它们标记为已检查。

为了简化这里的事情是你的代码的更新版本。还可以使用 headerTemplate 选项来设置标题模板 - 不要将您的字段命名为模板。

var array = {};
$('#grid').kendoGrid({
    dataSource: { data: [{id:3, test:'row check box will unchecked upon sorting'}]},
    sortable: true,
    dataBound:function(){
        for(f in array){
            if(array[f]){
                $('#'+f).attr('checked','checked');
            }
        }
    },
    columns:[
    {
        headerTemplate:'<input id="masterCheck" class="check" type="checkbox" /><label for="masterCheck"></label>', 
        template: '<input id="${id}" type="checkbox" />',
        filterable: false,
        width: 33,
        sortable: false // may want to make this sortable later. will need to build a custom sorter.
    },
        {field: 'test',
         sortable: true}
    ]});

var grid = $('#grid').data().kendoGrid;
$('#grid tbody').on('click',':checkbox',function(){   
    var id = grid.dataItem($(this).closest('tr')).id;
    if($(this).is(':checked')){        
        array[id] = true;
    }else{
        array[id] = false;
    }
})

Link 小提琴

【讨论】：

【解决方案2】：

如果您不太担心旧浏览器 HTML5 存储可能适合您 http://www.w3schools.com/html/html5_webstorage.asp 当然 jQuery 也有自己的数据存储能力。

【讨论】：

这根本不是答案。问题不在于在页面刷新之间保留数据。