pagehelper实现分页(ajax)

1.maven配置分页插件

<！ - 分页插件 - >
  
       com.github.pagehelper 
       pagehelper 
       3.4.2 
  

2.Constant中设置常量，每页要显示的记录数

public static int PAGESIZE = 5;

3.mapper接口和映射文件

/**
 * 查询全部学生或者根据姓名和班级查询
 * @param student  学生对象
 * @return 查询到的学生列表
 */
List getStus(Student student);

4.service接口和实体类

【注意】startPage方法之后要紧跟进行分页的SQL语句

@Override
public List getStus(int pageIndex, int pageSize, Student student) {
    /**
     * 1.进行分页处理
     * 2.显示第pageIndex页的pageSize条数据
     * 3.在查询之前执行PageHelper的startPage方法之后紧跟要进行分页的查询语句
     */
    PageHelper.startPage(pageIndex,pageSize);
    List lists = studentMapper.getStus(student);
    return lists;
}

5.handler

【注意】

• 入参：pageIndex
• pageIndex的设置
• pageInfo用来保存数据
• modelAndView

@RequestMapping("/getStus.do")
@ResponseBody
public ModelAndView getStus(@RequestParam(required = false) Integer pageIndex,@RequestParam(required = false) String querystuName,@RequestParam(required = false) Integer gradeId,HttpServletRequest request){
    //student对象用来存放实现动态查询的条件
    Student student = new Student();
    student.setStuName(querystuName);
    student.setStuGradeId(gradeId);
    /**
     * 【pageIndex1】 要查询第几页
     * 如果没有传入pageIndex则查询第一页，否则查询当前要查询的页数
     */
    int pageIndex1 = pageIndex==null?1:pageIndex;
    //执行查询
    List stuslist = studentService.getStus(pageIndex1,Constant.PAGESIZE,student);
    //【pageInfo】用来保存分页查询之后的信息，可以获取总记录数   【stuslist】service层返回的结果
    PageInfo pageInfo= new PageInfo(stuslist);
    //把分页查询得到的信息保存并且返回一个HTML页面（data.jsp），实现Ajax分页
    ModelAndView modelAndView = new ModelAndView("data");
    modelAndView.addObject("pageInfo",pageInfo);
    return modelAndView;
}

6.js

//窗体加载时
$(function () {
    nav(1);//调用分页查询的方法
});
//分页显示数据
function nav(index) {
    /**
     * 1.【$("#frmSeach").serialize()】 序列化表单
     * 2.【pageIndex】 传入当前要显示的页数
     */
    var data = $("#frmSeach").serialize()+"&pageIndex="+index;
    $.ajax({
        url:"/getStus.do",
        type:"post",
        data:data,
        dataType:"html",  //【注意返回的数据类型为：html】
        success:function (data) {
            $("#tabData").html(data);//handler返回的内容显示在页面中
        }
    });
}

7.jsp  —— 显示结果

• pageInfo：保存了分页查询之后的所有数据，包括对象列表信息，总记录数，当前页数等
• pageInfo.getList() ：得到执行查询之后的对象的信息
• formatDate：格式化日期

  <c:forEach items="${pageInfo.getList()}" var="info" varStatus="statu">
      <c:if test="${statu.count%2==0}">style="background-color: #5bc0de" c:if>>
          ${statu.count}
          ${info.stuId}
          ${info.stuName}
          ${info.stuSex}
          <fmt:formatDate value="${info.stuBirthday}" pattern="yyyy年MM月dd日">fmt:formatDate>
          
          ${info.gradeName}
          src="statics/uploadfiles/${info.stuPic}"  width="25px" height="25px">
          
              href="javascript:;" class="btn btn-default" data-toggle="modal" data-target="#exampleModal"  data-whatever="${Student.stuId}">修改
              href="javascript:;" οnclick="delStu(${Student.stuId})" class="btn btn-default">删除
          
      
  c:forEach>

8.jsp  —— 【处理页码】

• href="javascript:;" 
• onclick =“nav（param）”: js中调用nav方法  参数为当前显示第几页
• pageInfo.pageNum：当前的pageInfo中是第几页
• pageInfo.pages：根据总记录数和每页要显示的记录数得到的【总页数】

  class="row">
          
  class="col-md-6">
              
  aria-label="Page navigation">
                  
  class="pagination">
                      
  href="javascript:;"  οnclick="nav(1)">首页
                      <c:if test="${pageInfo.pageNum!=1}">
                          
   href="javascript:;" οnclick="nav(${pageInfo.pageNum-1})">上一页
                      c:if>
                      <c:forEach begin="1" end="${pageInfo.pages}" varStatus="statu">
                          
   href="javascript:;" οnclick="nav(${statu.count})">${statu.count}
                      c:forEach>
                      <c:if test="${pageInfo.pageNum!=pageInfo.pages}">
                          
   href="javascript:;" οnclick="nav(${pageInfo.pageNum+1})">下一页
                      c:if>
                      
  href="javascript:;" οnclick="nav(${pageInfo.pages})">尾页
                   
              
          
          
  class ="col-md-2">
              第 ${pageInfo.pageNum}页 / 共  ${pageInfo.pages}页