jquery 分页

jquery 和 java 后台代码 将查询到的数据 返回并分页

第一步 js函数

  var mobile = $.sysop.kit.getUrlValue('callingno');
			var userId = $.sysop.kit.getUrlValue('workno');
			var password = $.sysop.kit.getUrlValue('password');
			var calledNo = $.sysop.kit.getUrlValue('calledno');
			$('#mobile').attr("value",mobile);
// 上面几句代码 是通过请求路径(url) 获取参数值
			/*
			 * 搜索
			 */
			function searchRecodeInfo(page,disR){						
				var fn = arguments.callee;//$('#f_2').serialize() + 'mobile='+mobile+
				var req = 'mobile='+mobile+'&page='+(page||1)+'&displayRecord='+(disR=disR||10)+'&rand='+Math.random();//默认10									
				$.post("/data/searchRecodeInfoList.do", req, function(json) {	
					if(json.success !== true){
						//提示报错
						alert(json.message);
					} else{				
						var count 	= json.object.count,
						list 		= json.object.lists,
						p 			= json.object.page,
						pCount 		= json.object.pageCount;

						var $tbody = $('#J_tbody'), $box = $('#box');	
						var html = '';
						$.each(list,function(i,n){
							var status_class = "issues_l1";
							if(n.status == 1){
								status_class = "closed";
							}							
							var acceptedTime = (n.acceptedTime == null)?"--":new Date(n.acceptedTime).Format("yyyy-MM-dd hh:mm:ss");
							var handleTime = (n.handleTime == null)?"--":new Date(n.handleTime).Format("yyyy-MM-dd hh:mm:ss");
							// lastProcessResult 最终处理结果       recodeType  记录类型
							var lastProcessResult = n.lastProcessResult == 1?"未处理":n.lastProcessResult == 2?"处理成功":"处理失败";
							var recodeType = n.recodeType==1?"一般业务咨询":n.recodeType==2?"潜在风险类":n.recodeType==3?"投诉":"开户咨询";
							var text = "<tr class='" + status_class + "'><td><a href='/recodeInfo/recodeInfoEdit.jspx?recodeId=" + n.recodeId + 
							"'>"+n.memberName + "</a>"+'</td>' +
							'<td>'+acceptedTime+'</td>'+
							'<td>'+handleTime+'</td>'+								
							'<td>' + n.acceptMan + '</td>' +
							'<td>'+n.thecontent+'</td>'+
							'<td>'+n.followUpsituation+'</td>'+								
							'<td>' + lastProcessResult + '</td>' +
							'<td>'+recodeType+'</td>'+
							'<td>'+n.remark+'</td>'+								
							'</tr>';						
							if(null != text && text != ""){ 					
								html += text; 					
							}
						});
						$tbody.html(html);
						var sort = $('#tr_head').find('td');
						$('#count').html(" | 记录数("+count+")");					
						$('#comeMobileCount').text(count);
						//分页
						var $pag=$box.find('.paginationbar'),$dis=$box.find('.displayNum');
						$.sysop.pagination.init($pag,p,pCount,10,function(num){
							fn(num,disR);
						});
						//显示数目
						$.sysop.pagination.displayNum($dis,disR,function(){
							fn(1,this.innerHTML.slice(0,-1));
						});					
					}
				});
			}

第二部 默认执行

 $(function(){
					// $("#memberSex").attr("value",$("#sex").val());
					 // 请求来电历史列表
					 searchRecodeInfo($.crm.getPageSize(), true);					
				 });

第三部

$.crm = {
		isSuperAdmin:function(){
			if($.crm.getCurrentUserAccount() == 'linyudi' ||
					$.crm.getCurrentUserAccount() == 'sushuirong' ||
					$.crm.getCurrentUserAccount() == 'huangchaodong' ||
					$.crm.getCurrentUserAccount() == 'lidandan'){
				return true;
			}else{
				return false;
			}
		},
		/*
		 * 取单页的显示数量
		 */
		getPageSize:function(){
			pageSize = $('#displayNum_cont span.cur').text().split('条')[0];
			if(null != pageSize || pageSize != ""){
				return parseInt(pageSize);
			}else{
				return 10;
			}			
		},
		/**
		 * 取当前Cookie值
		 * 
		 */
		getCookieVal : function(name){
			var cookie=document.cookie;
			var offset=cookie.indexOf(name+'=');
			if(offset==-1) return '';
			var sIndex= cookie.indexOf ("=", offset)+1;
			var eIndex = cookie.indexOf (";", offset);
			if (eIndex == -1) eIndex = cookie.length;
			return unescape(cookie.slice(sIndex, eIndex));
		},

		/**
		 * 取当前系统的用户名
		 * 
		 */
		getCurrentUserAccount: function() {
			var user_name = $.ims.getCookieVal('jm_privilege_user_name');	
			return user_name;
		},

这里是 html 页面 用于存放列表

<div class="cont" id="box">
							<table class="cyan" id="over_view_table">
								<thead>
									<tr id='tr_head'>
										<td class="col1 sort issues_l1 ">来电客户姓名</td>
										<td class="col1 sort issues_l1 ">受理时间</td>
										<td class="col1 sort issues_l1 ">处理时间</td>
										<td class="col1 sort issues_l1 ">受理座席</td>
										<td class="col1 sort issues_l1 ">致电内容</td>
										<td class="col1 sort issues_l1 ">跟进处理情况</td>
										<td class="col1 sort issues_l1 ">最终处理结果</td>
										<td class="col1 sort issues_l1 ">记录类型</td>
										<td class="col1 sort issues_l1 ">备注</td>
									</tr>
								</thead>
								<tbody id="J_tbody">

								</tbody>
							</table>
							<div id="paginationbar" class="paginationbar"></div>
							<!--分页导航-->
							<div id="displayNum" class="displayNum"></div>
							<!--每页显示数目导航-->
							<div class="clear"></div>
						</div>

第四部 就是 Java后台代码处理

@MethodResourceDesc(name = "搜索来电历史列表")
	@RequestMapping(value = "/data/searchRecodeInfoList.do")
	@ResponseBody	
	public Result searchRecodeInfo(HttpServletRequest request,HttpServletResponse response){
		Result result = new Result();
		try{
			Query query = CRMQueryHelper.makeSearchRecodeInfoQuery(
					RequestHelper.getQueryFields(request, RecodeInfo.ACCEPTMAN),
					RequestHelper.getQueryFields(request, RecodeInfo.MEMBERACCOUNT),
					RequestHelper.getQueryFields(request, RecodeInfo.MEMBERNAME),
					RequestHelper.getQueryFieldsInt(request, RecodeInfo.RECODETYPE),
					RequestHelper.getQueryFieldsInt(request, RecodeInfo.SERIZECLASS),
					RequestHelper.getQueryFields(request, RecodeInfo.DISTRIBUTORNAME),
					RequestHelper.getQueryFields(request, RecodeInfo.MOBILE),
					RequestHelper.getQueryFields(request, RecodeInfo.MEMBERTYPE),
					RequestHelper.getQueryFieldsDate(request, "begin", "yyyy-MM-dd"),
					RequestHelper.getQueryFieldsDate(request, "end", "yyyy-MM-dd"),
					RecodeInfo.ACCEPTEDTIME, 
					Order.ASCENDING
					);		
			int allCount = (int)recodeService.count(query);			
			int pageSize = RequestHelper.getPageSize(request);

			if(0 == pageSize){
				pageSize = 20;
			}

			List<RecodeInfo> list = recodeService.listRecodeInfo(
					query.skip(
							(RequestHelper.getPageIndex(request) - 1) * pageSize
							).limit(pageSize)
							);

			PagingVO pagingObject = new PagingVO();
			pagingObject.setPageCount((allCount + pageSize) / pageSize);
			pagingObject.setPage(RequestHelper.getPageIndex(request));
			pagingObject.setCount(allCount);
			pagingObject.setLists(list);
			result.setCode(ResultCode.SUCCESS);
			result.setObject(pagingObject);	

		}catch(Exception e){
			result.setMessage(e.getMessage());
			logger.error(e.getMessage());
		}					
		return result;
	}

下面相应的代码 附加 jar包太大