SpringMVC实现前端分页

使用maybatis进行前端数据分页显示

mybatis自动生成工具

利用limit语句，首先利用Mybits自动生成工具生成mapper.xml文件

在mapper.xml文件 select标签 id为selectByExample中添加上limit语句

    <if test="startRow != null and pageSize != null and pageSize != 0">
    limit #{startRow},#{pageSize}
    </if>

如下 

在Mybatis自动生成的Example类中添加起始字段”startRow"和需要显示的数据条数字段"pageSize",设置好get/set方法。

PageBen分页类

package com.java.tools;

import java.io.Serializable;
import java.util.List;

public class PageBean<T> implements Serializable {
    //已知数据
    private int pageNum;    //当前页,从请求那边传过来。
    private int pageSize;    //每页显示的数据条数。
    private int totalRecord;    //总的记录条数。查询数据库得到的数据
    
    //需要计算得来
    private int totalPage;    //总页数，通过totalRecord和pageSize计算可以得来
    //开始索引，也就是我们在数据库中要从第几行数据开始拿，有了startIndex和pageSize，
    //就知道了limit语句的两个数据，就能获得每页需要显示的数据了
    private int startIndex;        
        
    
    //将每页要显示的数据放在list集合中
    private List<T> list;
    
    //分页显示的页数,比如在页面上显示1，2，3，4，5页，start就为1，end就为5，这个也是算过来的
    private int start;
    private int end;
    
    //通过pageNum，pageSize，totalRecord计算得来tatalPage和startIndex
    //构造方法中将pageNum，pageSize，totalRecord获得
    public PageBean(int pageNum,int pageSize,int totalRecord) {
        this.pageNum = pageNum;
        this.pageSize = pageSize;
        this.totalRecord = totalRecord;
        
        //totalPage 总页数
        if(totalRecord%pageSize==0){
            //说明整除，正好每页显示pageSize条数据，没有多余一页要显示少于pageSize条数据的
            this.totalPage = totalRecord / pageSize;
        }else{
            //不整除，就要在加一页，来显示多余的数据。
            this.totalPage = totalRecord / pageSize +1;
        }
        //开始索引
        this.startIndex = (pageNum-1)*pageSize ;
        //显示5页，这里自己可以设置，想显示几页就自己通过下面算法修改
        this.start = 1;
        this.end = 5;
        //显示页数的算法

        if(totalPage <=5){
            //总页数都小于5，那么end就为总页数的值了。
            this.end = this.totalPage;
        }else{
            //总页数大于5，那么就要根据当前是第几页，来判断start和end为多少了，
            this.start = pageNum - 2;
            this.end = pageNum + 2;
            
            if(start < 0){
                //比如当前页是第1页，或者第2页，那么就不如和这个规则，
                this.start = 1;
                this.end = 5;
            }
            if(end > this.totalPage){
                //比如当前页是倒数第2页或者最后一页，也同样不符合上面这个规则
                this.end = totalPage;
                this.start = end - 5;
            }
        }
    }
//get、set方法。
    public int getPageNum() {
        return pageNum;
    }

    public void setPageNum(int pageNum) {
        this.pageNum = pageNum;
    }

    public int getPageSize() {
        return pageSize;
    }

    public void setPageSize(int pageSize) {
        this.pageSize = pageSize;
    }

    public int getTotalRecord() {
        return totalRecord;
    }

    public void setTotalRecord(int totalRecord) {
        this.totalRecord = totalRecord;
    }

    public int getTotalPage() {
        return totalPage;
    }

    public void setTotalPage(int totalPage) {
        this.totalPage = totalPage;
    }

    public int getStartIndex() {
        return startIndex;
    }

    public void setStartIndex(int startIndex) {
        this.startIndex = startIndex;
    }

    public List<T> getList() {
        return list;
    }

    public void setList(List<T> list) {
        this.list = list;
    }

    public int getStart() {
        return start;
    }

    public void setStart(int start) {
        this.start = start;
    }

    public int getEnd() {
        return end;
    }

    public void setEnd(int end) {
        this.end = end;
    }

    @Override
    public String toString() {
        return "PageBean{" +
                "pageNum=" + pageNum +
                ", pageSize=" + pageSize +
                ", totalRecord=" + totalRecord +
                ", totalPage=" + totalPage +
                ", startIndex=" + startIndex +
                ", list=" + list +
                ", start=" + start +
                ", end=" + end +
                '}';
    }
}

controller类

package com.java.controller;

import com.java.model.Student;
import com.java.model.StudentExample;
import com.java.service.StudentMapperService;
import com.java.tools.PageBean;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.List;

@Controller
@RequestMapping("pageController")
public class PageController {

    
    @Autowired
    private StudentMapperService studentMapperService;
    @RequestMapping("page.do")
    /**
     * @param pageNum 当前页,从前台获取。
     */
    public String pageTest(Model model,String pageNum){
        //设置每页显示5条数据
        int pageSize=5;
        int num=Integer.parseInt(pageNum);
        PageBean<Student> page = findAll(num, pageSize);

        model.addAttribute("page",page);
        return "page";
    }

    /**
     * 
     * @param pageNum 当前页
     * @param pageSize 每页显示条数
     * @return
     */
    public PageBean<Student> findAll(int pageNum, int pageSize){
        //查询总数
        StudentExample studentExample=new StudentExample();
        //查询数据总量 语句如 select count(*) from student;
        int totalRecord = studentMapperService.countByExample(studentExample);
        //传递参数 pageNum,pageSzie,totalRecord。
        PageBean pageBean=new PageBean(pageNum,pageSize,totalRecord);
        //设置limit起始数据和查询量。 sql语句如 select * from student limit 1,5; startRow,pageSize;
        studentExample.setStartRow(pageBean.getStartIndex());
        studentExample.setPageSize(pageSize);
        //利用limit查询出数据 select * from student limit 'x','x'; startRow,pageSize;
        List<Student> pageStudent = studentMapperService.selectByExample(studentExample);
        //将数据传递给PageBean
        pageBean.setList(pageStudent);
        return pageBean;
    }
}

最后jsp页面

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/1/11
  Time: 15:57
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Page</title>
    <link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery.js"></script>
    <script src="../js/bootstrap.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div class="container">
    <form role="form">
        <table class="table table-striped table-bordered">
            <thead>
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>邮箱</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach var="s" items="${page.list}">
               <tr>
                    <td>${s.id}</td>
                    <td>${s.name}</td>
                    <td>${s.age}</td>
                    <td>${s.email}</td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
        共有数据:${page.totalRecord}条
        <ul class="pagination">
            <!--如果当前页大于第一页，则显示上一页按钮 -->
            <c:if test="${page.pageNum>1}">
            <li><a href="<%=request.getContextPath()%>/pageController/page.do?pageNum=${page.pageNum-1}">&laquo;</a></li>
            </c:if>
            <!-- 设置页码 -->
           <c:forEach begin="${page.start}" end="${page.end}" var="i">
               <c:if test="${page.pageNum== i}">
                   <li><a href="<%=request.getContextPath()%>/pageController/page.do?pageNum=${i}">${i}</a></li>
               </c:if>
               <c:if test="${page.pageNum != i}">
                   <li><a href="<%=request.getContextPath()%>/pageController/page.do?pageNum=${i}">${i}</a></li>
               </c:if>
            </c:forEach>
            <!--如果当前页小于总页数，则显示下一页按钮 -->
            <c:if test="${page.pageNum<page.totalPage}">
            <li><a href="<%=request.getContextPath()%>/pageController/page.do?pageNum=${page.pageNum+1}">&raquo;</a></li>
            </c:if>
        </ul>
    </form>
</div>
</body>
</html>