jqGrid <-- json --> spring,hibernate之服务器端分页，排序
最近做了一个以jqGrid实现的数据表格，与服务器端（spring + hibernate）以json格式交换数据，分页
和排序都在服务器端实现，现总结如下：

操作页面是这样的：



用户输入查询信息，按“检索”按钮，返回查询结果，表格可以翻页，排序。

当把jqGrid的属性datatype定义为function时，表格需要获取数据时（翻页，排序等），jqGrid就会调用
这个function，通过这种机制，就可以实现服务器端分页、排序。需要注意的是，这个function需要读取
数据并显式地调用addJSONData，addXMLData等去刷新表格，详情可以参看：
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data#function

这个函数有一个参数，关于参数的定义我没有找到，但用firebug之类的工具可以看出包括如下的属性：
_search ： （不清楚）
nd ： （不清楚）
page ： 当前页
rows ： 每页记录数
sidx ： sort index，排序字段名
sord ： sort direction，排序方式：asc， desc

这样一来，我们就可以把这些数据发送到服务器端进行分页和排序。

以下是页面的html代码：

	<table width="95%">
		<tr>
			<td>
				<table>
					<tr>
						<td>
							<form id="frmSearchCustomer">
								<table>
									<tr>
										<td>
											名称：<input type="text" name="name" />
											アドレス：<input type="text" name="addr" />
										</td>
									</tr>
									<tr>
										<td>
											担当者：<input type="text" name="dandang" />
										</td>
									</tr>
								</table>
							</form>
						</td>
					</tr>
					<tr>
						<td>
							<button id="search">检索</button>
							<button id="clear">清除条件</button>
						</td>
					</tr>
				</table>
			</td>
		</tr>
		<tr>
			<td>
				<table id="list"></table>
				<div id="pager"></div> 
			</td>
		</tr>
	</table>

以下是jqGrid初始化的代码：

	$("#list").jqGrid({
		datatype : function(postdata) {
			postdata = mergeObject(jsonCondition, postdata);
			
			jQuery.ajax({
				type : 'POST',
				contentType : 'application/json',
				url : ROOT_PATH + '/customer/search.do',
				data : JSON.stringify(postdata),
				dataType : 'json',
				success : function(resp) {
					if (resp.successed) {
						var thegrid = jQuery("#list")[0];
						thegrid.addJSONData(resp.returnObject);
					} else {
						alert(resp.errors[0].message);
					}
				},
				error : ajaxFailed
			});
		},
		height : '100%',
		rowNum : '10',
		jsonReader : {
			repeatitems: false
		},
		colNames : ['顧客番号', '名称', 'アドレス', '担当者', '携帯', '電話①', '電話②'],
		colModel : [ 
				   {name:'id', index:'id', width:80}, 
				   {name:'name', index:'name', width:256},
				   {name:'addr', index:'addr', width:256},
				   {name:'dandang', index:'dandang', width:64},
				   {name:'mobile', index:'mobile', width:128},
				   {name:'phone1', index:'phone1', width:128},
				   {name:'phone2', index:'phone2', width:128},
				 ],
		pager : '#pager'
	});

其中关键就是datatype为一function，在这个function中通过jQuery.ajax发送一个请求，获取数据，然后通过
addJSONData刷新表格数据。发送的数据包括postdata和用户输入的查询条件，其中postdata是jqGrid传递过来
的包含分页、排序信息的对象，jsonCondition是“检索”按钮中生成的包含查询条件的对象。
检索按钮中的处理如下：

	var jsonCondition = {};
	
	function search() {
		jsonCondition = array2Json(jQuery("#frmSearchCustomer").serializeArray());
		jQuery("#list").trigger("reloadGrid");
	}

其中array2Json是从网上找来的把jQuery的serializeArray生成的数组转成json的函数，我以前的文章里有，这里
就不重复了。

mergeObject是一个我自己写的拷贝一个对象的属性到另一对象的函数：

	function mergeObject(src, dest) {
		var i;
		for(i in src) {
			dest[i]=src[i];
		}
		return dest;
	}

下面说下服务器端。
我用的spring的controller是直接接受json数据并以json格式返回数据的，这部分是延续以前的做法的，可以参见
我以前的文章：
jquery(1.3.2)<--json-->spring(3.0)
jquery<--json-->spring(3.0)之后台校验

我定义了一个对应jqGrid的postdata的类：

	public class JQGridRequest