JqGrid作翻頁一

【適用範圍】:web系統中不一樣的頁面對應對象區表格數據選擇的模式不一樣,單選或多選控制javascript

【弊端】:單選和多選模式不能共存java

1.記錄翻頁後前頁的所選行狀態web

2.獲取數據庫中選中模式的配置,單選或多項數據庫

實現的就是代碼以下:緩存

var _arrGlobalData = new Array(); //全局的緩存變量,存儲所選的id
var isMultiSelect = true;  //是否多選 true 多選  false 單選

$("#jq_table").jqGrid('GridUnload');
jQuery("#jq_table").jqGrid({
	data:data,
	datatype : "local",
	colNames : [ 'id','Item1', 'Item2' ,......],
	colModel : [ 
		{name : 'id',index : 'id',width:70, hidden:true},
		{name : 'item1',index : 'item1',sortable:true,width:70}, 
		{name : 'item2',index : 'item2',width:70},
   ........
	],
	rowNum : 5,
        rowList : [ 5,10,15 ],
        width: '244',
        height : autoHeight,
        pager : '#jq_table_jqpager',
        autoScroll: true,
        multiselect: true, //控制多選
        viewrecords: false,
        gridComplete:function(){
        	var allData = $(this).jqGrid('getDataIDs');//獲取當頁全部行的id
        	var oldData = _arrGlobalData ;
        	for(var i = 0; i < allData.length; i++){
        		for(var j = 0; j < oldData.length; j++){
        			if(allData[i]==oldData[j]){
        				$('#jq_table').jqGrid('setSelection', allData[i], false);
        				break;
        			}
        		}
        	}
        },
        onSelectRow:function(id,status){
        	var rowid = $(this).jqGrid('getGridParam', 'selarrrow');
        	if(!isMultiSelect){
        		_arrGlobalData = rowid;
        	}else{
        		if(status==false){
        			_arrGlobalData .splice(_arrGlobalData .indexOf(id),1);
        		}
            	for(var i=0;i<rowid.length;i++){
            		if(_arrGlobalData .indexOf(rowid[i])==-1){
            			_arrGlobalData .push(rowid[i]);
            		}
            	}
        	}
        	if(status){
        		//這裏能夠寫點擊觸發事件
        	}
        },
        onSelectAll: function(ids,status){
        	if(status==false){
        		for(var k=0;k<ids.length;k++){
        			_arrGlobalData .splice(_arrGlobalData .indexOf(ids[k]),1);
        		}
    		}else{
    			for(var i=0;i<ids.length;i++){
            		if(_arrGlobalData .indexOf(ids[i])==-1){
            			_arrGlobalData .push(ids[i]);
            		}
            	}
    		}
        },
	    caption : "實現翻頁"
    });

下邊的方法爲動態控制單選多選,data參數可爲數據動態獲取的配置,獲取data後觸發下邊方法便可this

function jqgridSet(data){
isMultiSelect = data;
jQuery("#jq_table").jqGrid('setGridParam',{
	        	multiboxonly:false,
	        	beforeSelectRow: function(rowid, e){  
    	                	return true;  
            		}
        	});
  $("#jq_table").find("#jqgh_jq_table_cb").find("#cb_jq_table").attr("disabled",false);
		if(!isMultiSelect) {//單選
	    		jQuery("#jq_table").jqGrid('setGridParam',{
	            		multiboxonly:true,
	            		beforeSelectRow: function(rowid, e){
	            			jQuery("#jq_table").jqGrid('resetSelection');
	    	                	return true;  
	            		}
	        	});
	    		if(_arrGlobalData.length>1){
	    			var oldData = new Array();
	    			for(var k=0; k<_arrGlobalData.length; k++){
	    				oldData.push(_arrGlobalData[k]);
	    			}
	    			for(var i=0; i<oldData.length-1;i++){
	    				jQuery("#jq_table").jqGrid('setSelection', oldData[i]);
	    			}
	    			var rowids = jQuery("#jq_table").jqGrid('getGridParam', 'selarrrow');
	    			if(rowids.length<=0){
	    				var allData = jQuery("#jq_table").jqGrid('getDataIDs');
	    				jQuery("#jq_table").jqGrid('setSelection', allData[allData.length-1]);
	    			}
	    		}
	     	       $("#jq_table").find("#jqgh_jq_table_cb").find("#cb_jq_table").attr("disabled",true);
	        }
}
相關文章
相關標籤/搜索