2

剣道グリッド内の各行にチェックボックスがあります。ユーザーがグリッドをソートまたはフィルタリングすると、チェックボックスからチェックマークがクリアされます。並べ替えまたはフィルターの実行後にチェックボックスのチェックを外したり、再度チェックしたりしないようにするにはどうすればよいですか? 並べ替え中の動作を観察するには、次の js フィドルを参照してください。

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}
]});
4

2 に答える 2

4

基本的に、グリッドが再描画されるため、選択は毎回クリアされます。チェック項目を配列またはオブジェクトに格納できます。グリッドが再描画されると (dataBound イベント)、チェック済みとして再びマークできます。

簡単にするために、コードの更新バージョンを示します。また、headerTemplate オプションを使用してヘッダー テンプレートを設定します。代わりに、フィールドに template のような名前を付けないでください。

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;
    }
})

フィドルへのリンク

于 2013-01-22T23:29:33.120 に答える
-1

古いブラウザーについてあまり心配していない場合は、HTML5 ストレージが適しているかもしれません http://www.w3schools.com/html/html5_webstorage.asp もちろん、jQuery には独自のデータ ストレージ機能があります。

于 2013-01-23T00:19:28.083 に答える