SSM整合分页-蒲公英云

分页
1.准备
1.1 BasePage类便于封装分页数据

//分页工具类
public class BasePage { 
    //当前页
    private Integer currentPage = 0;
    //每页显示的条数
    private Integer pageSize = 5;
    public Integer getCurrentPage() { 
        return currentPage;
    }
    public void setCurrentPage(Integer currentPage) { 
        this.currentPage = currentPage;
    }
    public Integer getPageSize() { 
        return pageSize;
    }
    public void setPageSize(Integer pageSize) { 
        this.pageSize = pageSize;
    }

创建UserDto,并需要继承PageInfo类

public class UserDto extends PageInfo<User>

1.2 前端分页栏放在webapp文件夹下

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
 <div>
        共有${ pageModel.total }条记录，共${ pageModel.pages }页，每页
      <select name="pageSize" onchange="changePageSize(this.value)" style="width: 50px;">
          <option value="10" ${ pageModel.pageSize==10?"selected":"" }>10</option>
          <option value="20"  ${ pageModel.pageSize==20?"selected":"" }>20</option>
          <option value="50"  ${ pageModel.pageSize==50?"selected":"" }>50</option>
          <option value="100"   ${ pageModel.pageSize==100?"selected":"" }>100</option>
      </select>  
        条记录，当前${ pageModel.pageNum }/${ pageModel.pages }页，
    <a href="javascript:homePage()">首页</a>|
    <a href="javascript:frontPage()">上一页</a>|
    <a href="javascript:nextPage()">下一页</a>|
    <a href="javascript:lastPage()">尾页</a>|
    转到<select name="pageNum" onchange="goPage(this.value)" style="width: 50px;">
       <c:forEach begin="1" end="${pageModel.pages }" var="i">
          <option value=${ i }  ${ pageModel.pageNum==i?"selected":"" }>${ i }</option>
       </c:forEach>
    </select>
   </div>
    <script type="text/javascript">
       function homePage(){ 
           document.getElementById("pageNum").value=1;
           document.getElementById("pager").submit();//表单提交
       }
       function frontPage(){ 
           document.getElementById("pageNum").value=${ pageModel.pageNum<=1? 1 : pageModel.pageNum-1 };
           document.getElementById("pager").submit();//表单提交
       }
       function nextPage(){ 
           document.getElementById("pageNum").value=${ pageModel.pageNum>=pageModel.pages?pageModel.pages:pageModel.pageNum+1 };
           document.getElementById("pager").submit();//表单提交
       }
       function lastPage(){ 
           document.getElementById("pageNum").value=${ pageModel.pages };
           document.getElementById("pager").submit();//表单提交
       }
       function goPage(cur_page){ 
           document.getElementById("pageNum").value=cur_page;
           document.getElementById("pager").submit();//表单提交
       }
       function changePageSize(cur_pageSize){ 
           document.getElementById("pageSize").value=cur_pageSize;
           document.getElementById("pager").submit();//表单提交
       }
    </script>

1.3 前端页面

<div class="pagin">
        <form action="/user/queryPage" method="post" id="pager">
            <input type="hidden" name="pageNum" id="pageNum" value="${pageModel.pageNum}">
            <input type="hidden" name="pageSize" id="pagSize" value="${pageModel.pageSize}">
        </form>
        <jsp:include page="/basePage.jsp"></jsp:include>
</div>

2.后端请求实现
后端分页通过mybatis的分页插件PageHelper来实现,需要在mybatis的配置文件中添加分页拦截器

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <plugins>
        <!-- com.github.pagehelper为PageHelper类所在包名 -->
        <plugin interceptor="com.github.pagehelper.PageHelper">
            <property name="dialect" value="mysql" />
            <!-- 该参数默认为false -->
            <!-- 设置为true时，会将RowBounds第一个参数offset当成pageNum页码使用 -->
            <!-- 和startPage中的pageNum效果一样 -->
            <property name="offsetAsPageNum" value="true" />
            <!-- 该参数默认为false -->
            <!-- 设置为true时，使用RowBounds分页会进行count查询 -->
            <property name="rowBoundsWithCount" value="true" />
            <!-- 设置为true时，如果pageSize=0或者RowBounds.limit = 0就会查询出全部的结果 -->
            <!-- （相当于没有执行分页查询，但是返回结果仍然是Page类型） -->
            <property name="pageSizeZero" value="true" />
            <!-- 3.3.0版本可用 - 分页参数合理化，默认false禁用 -->
            <!-- 启用合理化时，如果pageNum<1会查询第一页，如果pageNum>pages会查询最后一页 -->
            <!-- 禁用合理化时，如果pageNum<1或pageNum>pages会返回空数据 -->
            <property name="reasonable" value="false" />
            <!-- 3.5.0版本可用 - 为了支持startPage(Object params)方法 -->
            <!-- 增加了一个`params`参数来配置参数映射，用于从Map或ServletRequest中取值 -->
            <!-- 可以配置pageNum,pageSize,count,pageSizeZero,reasonable,不配置映射的用默认值 -->
            <!-- 不理解该含义的前提下，不要随便复制该配置 -->
            <property name="params" value="pageNum=start;pageSize=limit;" />
            <!-- always总是返回PageInfo类型,check检查返回类型是否为PageInfo,none返回Page -->
            <property name="returnPageInfo" value="check" />
        </plugin>
    </plugins>
</configuration>

3.1 控制器

@Autowired        
    private IUserService userService;
//分页查询用户信息 当期页 每页显示的条数
    @RequestMapping("/queryPage")
    public String queryPage(UserDto dto,Model m){ 
        //默认值
        if(dto != null){ 
            if( dto.getPageNum() == 0 && dto.getPageSize() == 0){ 
                dto.setPageNum(1);
                dto.setPageSize(5);
            }
        }
        PageInfo<User> info = userService.queryPage(dto);
        m.addAttribute("pageModel",info);
        return "user/user";//该处在视图解析器中,省略了 .jsp
    }

3.2 Service层实现

//分页带条件查询用户信息
    PageInfo<User> queryPage(UserDto dto);
@Override
    public PageInfo<User> queryPage(UserDto dto) { 
        //设置分页的信息
        PageHelper.startPage(dto.getPageNum(),dto.getPageSize());
        List<User> list = this.query(dto.getUser());
        PageInfo<User> pageInfo = new PageInfo<User>(list);
        return pageInfo;
    }
@Override
    //查询用户信息
    public List<User> query(User user) { 
        UserExample example = new UserExample();
        if(user != null){ 
            Criteria criteria = example.createCriteria();
            if(StringUtils.isNotEmpty(user.getUserName())){ 
                //根据账号查询
                criteria.andUserNameEqualTo(user.getUserName());
            }
        }
        return userMapper.selectByExample(example);
    }

3.3 Dao层实现

List<User> selectByExample(UserExample example);
<select id="selectByExample" parameterType="com.i.pojo.UserExample" resultMap="BaseResultMap">
    select
    <if test="distinct">
      distinct
    </if>
    <include refid="Base_Column_List" />
    from t_user
    <if test="_parameter != null">
      <include refid="Example_Where_Clause" />
    </if>
    <if test="orderByClause != null">
      order by ${orderByClause}
    </if>
  </select>

4.测试
注意修改前端界面中获取数据的方式

<c:forEach items="${pageModel.list}" var="user">
            <tr>
                <td><input name="" type="checkbox" value="" /></td>
                <td>${user.userId}</td>
                <td>${user.userName}</td>
                <td>${user.realName}</td>
                <td>${user.email}</td>
                <td>${user.phone}</td>
                <td><a href="/user/getAddOrUpdateInfo?userId=${user.userId}" class="tablelink">修改</a>     
                    <a href="javascript:void(0)" οnclick="deleteUser(${user.userId})" class="tablelink"> 删除</a></td>
            </tr> 
</c:forEach>