jqGrid分页栏添加及相关问题

1.添加分页栏的步骤。

    1.1  .jsp页面    <div id="wfgs2010Pager"></div>

<div id="wfgs2010GyousyaData" class="grid-table" >
    <table id="gridGyousyaData"></table>
    <div id="wfgs2010Pager"></div>
</div>

  1.2 .js页面  在table下方添加div，jqGrid中 pager:"wfgs2010Pager" 参数为添加分页栏的参数。该项目做了内部封装。

$("#gbox_gridGyousyaData").remove();
$("#wfgs2010GyousyaData").append("<table id='gridGyousyaData'></table>");
$("#wfgs2010GyousyaData").append("<div id='wfgs2010Pager'></div>");
$("#gridGyousyaData").jqGrid({
		data: dataList,
		datatype:"local",
		multiboxonly:true,
		cellEdit:false,
		cellsubmit:'clientArray',
		colNames:colNames,
		colModel:colModel,
		width:gridWidth,
		height:gridHeight,
		pager:"wfgs2010Pager",
		rowNum:10,
		gridview: true,
		scroll:true,
		regional:'ja',
		onSelectRow:function(rowid, status){
			var row = $("#gridGyousyaData").jqGrid('getRowData',rowid);
			setRowData(row);
			$("#selRow").val(rowid);
		}
	});

2.复制原有的jqGridS时，grid底部只出现了蓝色div区域，并未出现分页及相关控件。

原因：scroll      创建一个动态滚动的表格，当为true时，翻页栏被禁用

方法：当需要使用分页栏时，去掉jqGrid中scoll参数。

3.问题：查出多条数据，设置了分页栏但所有数据任然在一页显示。

.

原因：下图1初始化时创建了grid 图2在后台查到数据后，返回js,在给grid赋值时，

            gridGyousyaData")[0].addJSONData(result.resultList);把查到的数据都赋给了第一页。

function createGyousyaDataGrid(data){
	var dataList = [];

	if(data && data.length > 0) {
		dataList = data;
	}

	$("#gbox_gridGyousyaData").remove();
	$("#wfgs2010GyousyaData").append("<table id='gridGyousyaData'></table>");
	$("#wfgs2010GyousyaData").append("<div id='wfgs2010Pager'></div>");
	$("#gridGyousyaData").jqGrid({
		data: dataList,
		datatype:"local",
		multiboxonly:true,
		cellEdit:false,
		cellsubmit:'clientArray',
		colNames:colNames,
		colModel:colModel,
		width:gridWidth,
		height:gridHeight,
		pager:"wfgs2010Pager",
		rowNum:10,
		gridview: true,
		//scroll:true,
		regional:'ja',
		onSelectRow:function(rowid, status){
			var row = $("#gridGyousyaData").jqGrid('getRowData',rowid);
			setRowData(row);
			$("#selRow").val(rowid);
		}
	});
}

function setGridData(){
     var postData = {
			keyword:$("#keyword").val(),
			kaisiNendo:$("#kaisiNendo").val(),
			gyoumu:$("#gyoumu").val(),
	}
	$.ajax({
		url: sofia.contextPath() + "/keiyaku/wfgs2000/wfgs2010/getGyoushaGrid.do",
		dataType: "json",
		async:false,
		type:"post",
		data: postData
	}).done(function(result) {
		$("#gridGyousyaData").jqGrid("clearGridData");
		if(result.resultList == null){
			//
			sofia.ui.showDialogJsMsg("E", "存在しません。");
			$("#gridGyousyaData")[0].addJSONData([{}]);
		}else{
			$("#gridGyousyaData")[0].addJSONData(result.resultList);
			//createGyousyaDataGrid(result.resultList);
			for(var i=0;i<10;i++){
				$("#jqgh_gridGyousyaData_nendo"+(i+1)).html(result.colum["nendo"+i]);
			}
		}
		sofia.ui.dispLoader(false);
	});
}

方法：所以如果没有分页栏赋值时，可以采用该方法赋值。

           有分页栏的赋值时，需要再走一遍初始化，从而来实现将所有的查到的数据分页显示。

function setGridData(){
	var postData = {
			keyword:$("#keyword").val(),
			kaisiNendo:$("#kaisiNendo").val(),
			gyoumu:$("#gyoumu").val(),
	}
	$.ajax({
		url: sofia.contextPath() + "/keiyaku/wfgs2000/wfgs2010/getGyoushaGrid.do",
		dataType: "json",
		async:false,
		type:"post",
		data: postData
	}).done(function(result) {
		$("#gridGyousyaData").jqGrid("clearGridData");
		if(result.resultList == null){
			//
			sofia.ui.showDialogJsMsg("E", "存在しません。");
			$("#gridGyousyaData")[0].addJSONData([{}]);
		}else{
			//$("#gridGyousyaData")[0].addJSONData(result.resultList);
			createGyousyaDataGrid(result.resultList);
			for(var i=0;i<10;i++){
				$("#jqgh_gridGyousyaData_nendo"+(i+1)).html(result.colum["nendo"+i]);
			}
		}
		sofia.ui.dispLoader(false);
	});
}