在ASP.NET MVC应用程序中进行分页时,在Telerik MVC网格中保留CheckBox状态

Question

我正在使用Telerik MVC Grid,其中一列是复选框.如果我选中复选框然后转到第2页然后返回第1页,则所有复选框都消失了.这当然是HTTP的工作方式.现在,我将所有选中的复选框放在隐藏字段中,但由于网格执行某种回发,因此下次清除隐藏字段.

Answer 1

如果您正在使用客户端数据绑定,则可以使用下面的javascript/jquery来维护复选框状态.

保持复选框状态:

var selectedIds = [];

$(document).ready(function () {
    //wire up checkboxes.
    $('#YOUR_GRID_ID :checkbox').live('change', function (e) {
        var $check = $(this);
        console.log($check);
        if ($check.is(':checked')) {
            //add id to selectedIds.
            selectedIds.push($check.val());
        }
        else {
            //remove id from selectedIds.
            selectedIds = $.grep(selectedIds, function (item, index) {
                return item != $check.val();
            });
        }
    });
});

数据绑定后恢复复选框状态:

function onDataBound(e) {
    //restore selected checkboxes.
    $('#YOUR_GRID_ID :checkbox').each(function () {
        //set checked based on if current checkbox's value is in selectedIds.
        $(this).attr('checked', jQuery.inArray($(this).val(), selectedIds) > -1);
    });
}

我的博客上提供了更详细的解释:http: //blog.cdeutsch.com/2011/02/preserve-telerik-mvc-grid-checkboxes.html