自定义分页工具(异步请求)

1. 分页工具类

public class PageInfo<T> {
    //当前页码	
    private Integer pageno;
	//每页显示数    
    private	Integer pagesize;
	//查询起始数,由pageno,pagesize计算得出   
     private Integer startIndex;
	//总页码,由pagesize,totalsize计算得出  
     private Integer totalpage;
    //总条数  
     private Integer totalsize;
	//需要显示的数据   
     private List<T> data;
	
	public PageInfo(Integer pageno,Integer pagesize) {
		if(pageno == null || pageno <= 0) {
			this.pageno = 1;
		} else {
			this.pageno = pageno;
		}
		if(pagesize == null || pagesize <= 0 ) {
			this.pagesize = 10;
		} else {
			this.pagesize = pagesize;
		}
	}

2.controller

@ResponseBody
	@RequestMapping("/index")
	public AjaxResult index(Integer pageno,Integer pagesize) {
		AjaxResult result = new AjaxResult();
		
		try {
			PageInfo<User> page = userService.queryPage(pageno,pagesize);
			result.setFlag(true);
			result.setPage(page);
		} catch (Exception e) {
			result.setFlag(false);
			result.setMessage("查询失败");
			e.printStackTrace();
		}
		
		return result;
	}

 AjaxResult 是自定义的用来封装请求结果的类,包含请求是否完成,失败信息和分页信息

3.service

@Override
	public PageInfo<User> queryPage(Integer pageno, Integer pagesize) {
		PageInfo<User> page = new PageInfo<User>(pageno, pagesize);

		List<User> users = userMapper.queryPage(page);
		Integer totalsize = userMapper.quertCount();

		page.setData(users);
		page.setTotalsize(totalsize);
		return page;
	}

至于mapper中都是很简单的查询语句.后台就这些东西.

4.js:主要是拼串,其它的就是把数据往里丢就行了

var loadingIndex = -1;
            function queryUserPage(pageno) {
            	$.ajax({
            		type:"post",
            		url:"${APP_PATH}/user/index",
            		data:{
            			"pageno":pageno
            		},
            		beforeSend:function() {
            			loadingIndex = layer.load(2, {time: 10*1000});
            		},
            		success:function(result){
            			layer.close(loadingIndex);
            			
            			if(result.flag) {
            			//拼串,用户数据
            			var page = result.page;
        				var data = page.data;
        				var content = "";
        				var contentBar = "";
        				//js中循环数组和集合
        				$.each(data,function(i,user) {
        					content += '<tr>';
               				content += '<td>' + (i + 1 + (page.pageno - 1) * page.pagesize) + '</td>';
               				content += '<td><input type="checkbox"></td>';
               				content += '<td>' + user.loginacct + '</td>';
               				content += '<td>' + user.username + '</td>';
               				content += '<td>' + user.email + '</td>';
               				content += '<td>';
               				content += '  <button type="button" class="btn btn-success btn-xs"><i class=" glyphicon glyphicon-check"></i></button>';
               				content += '  <button type="button" class="btn btn-primary btn-xs"><i class=" glyphicon glyphicon-pencil"></i></button>';
               				content += '  <button type="button" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>';
               				content += '</td>';
               				content += '</tr>';
        					
        				})
            			$("#tbody").html(content);
        				
        				//拼串,分页数据
        				contentBar += '<li><a href="#" onclick=changePage('+ 1 +') >首页</a></li>';
        				contentBar += '<li';
        				if(page.pageno==1) {
        					contentBar += ' class="disabled"';
        				}
        				contentBar += '><a href="#" onclick=changePage('+ (pageno - 1) +') >上一页</a></li>'; 
							
						//页码
						//确定页数,将页码存入数组
						var begin = 0;
						var end = 0;
						var arr = [];
						if(page.totalpage <= 10) {
							begin = 1;
							end = page.totalpage;
						} else if(page.pageno < 6) {
							begin = 1;
							end = 10;
						}else if(page.pageno + 4 > page.totalpage) {
							begin = page.totalpage - 9;
							end = page.totalpage;
						}else {
							begin = page.pageno - 5;
							end = page.pageno + 4;
						}
        				
						for(var i = begin, j = 0;i < end;i ++, j ++) {
							arr[j] = i;
						}
       				
						$.each(arr,function(i,j) {
							contentBar += '<li';
							if(page.pageno == j) {
								contentBar += ' class="active"';
							}
							contentBar += '><a href="#" onclick=changePage('+ j +') >'+ j +'</a></li>';
						})
						
        				contentBar += '<li';
        				if(page.pageno==page.totalpage) {
        					contentBar += ' class="disabled"';
        				}
        				contentBar += '><a href="#" onclick=changePage('+ (page.pageno+1) +') >下一页</a></li>';
        				contentBar += '<li><a href="#" onclick=changePage('+ page.totalpage +') >尾页</a></li>';
        				//$(".pagination")是需要将页码放进去的<tr>
            			$(".pagination").html(contentBar);
            			} else{
            				layer.msg(result.message, {time:1000, icon:5, shift:6});
            			}
            		}
            	});
            	
            }