jqGrid表格插件按照正常情況下，設置multiselect:true,，就可以實現多選。但是當數據分頁顯示時，翻頁後，之前已經選擇的就會失效。
這裡通過設置一個全局變量(checkBox),緩存已經選中的數據項，來實現翻頁後保持選中。再定義一個全局全局變量(cPage),重新加載的時候清空checkBox,在翻頁事件中運用這個cPage變量;
<html>
<head>
<title>jqGrid 實例</title>
</head>
<body>
···代碼省略···
<table id="list1"></table>
<p id="pager1"></p>
···代碼省略···
</body>
</html
function pageInit(){
jQuery("#list1").jqGrid({
url : ctx+'/JSONData',
datatype : "json",
colNames : [ 'Inv No', 'Date', 'Client', 'Amount', 'Tax','Total', 'Notes' ],
colModel : [
{name : 'id',index : 'id',width : 55},
{name : 'invdate', index : 'invdate',width : 90},
{name : 'name',index : 'name',width : 100},
{name : 'amount',index : 'amount', width : 80, align : "right"},
{name : 'tax',index : 'tax',width : 80,align : "right"},
{name : 'total',index : 'total',width : 80,align : "right"},
{name : 'note',index : 'note',width : 150,sortable : false}
],
rowNum : 10,
rowList : [ 10, 20, 30 ],
pager : '#pager13',
sortname : 'id',
viewrecords : true,
sortorder : "desc",
multiselect : true,
multikey : "ctrlKey",
caption : "翻頁行保持選中狀態",
editurl : "xxxxxx.php" ,
onPaging:function (pgButton) {
cPage++; //翻頁事件
},
loadComplete : function(data) {
if (cPage == 0) {
checkBox = [];//每次加載清空選中狀態
}
cPage = 0;
var rowArr = data.rows;
if (checkBox.length > 0) {
for (var i = 0; i < rowArr.length; i++) {
for (var j = 0; j < checkBox.length; j++) {
if (rowArr[i].id == checkBox[j].id) {
$("#list1").jqGrid('setSelection', rowArr[i].id);
break;
}
}
}
}
},
onSelectRow:function(rowId,status){
if(status){
if (checkBox.indexOf(rowId) == -1){
checkBox.push(rowId);
}
}else{
deleteCheckBox(rowId);
}
}
function deleteCheckBox(rowId){
for(var i = 0; i < checkBox.length; i++){
if (checkBox[i].rfqNo == rowId){
//根據索引值刪除checkBox中的數據
checkBox.splice(i,1);
}
}
}