web分页显示功能（“小案例：实现web端对客户资源的增删改查”里面的一个功能）

分页显示功能（“小案例：实现web端对客户资源的增删改查”里面的一个功能）

（2016年11月19日18:15:07 上课学习总结）

效果展示：

 第n页/共M页   首页  上一页 页码（1，2，3。。。）  下一页  尾页

分页需要的数据

 

1、当前页码：pageCode ---->jsp---servlet

 

2、总页数：totalPage --->servlet

 

3、每页记录数：pageSize --->servlet

 

4、当前页记录：datas ---->servlet

 

 

如何得到数据

 

1、当前页码:通过用户点击js页面上的超链接得到，默认值为1

 

2、总页数：总记录数 % 每页记录数 == 0 ？ 总记录数 / 每页记录数  : 总记录数 / 每页记录数 + 1

 

3、总记录数:totalRecord，查询数据库表得到，select count(*)  from customer;

 

可以看出 现在数据库中有 201 条数据

 

4、每页记录数：系统给定的固定值，pageSize = 10；

 

5、当前页记录：保存在集合中，通过查询数据库表得到，select *  from customer limit  (pageCode-1)*pageSize, pageSize;

 

 

把所有的分页有关的数据封装到PageBean中，将以上数据作为它的属性

【1】编写PageBean.java 类，形成业务类

1. package cn.edu.aynu.rjxy.bean;
2.  
3. import java.util.List;
4.  
5. /**
6. * 这个bean用于分页显示
7. *
8. * @author 子
9. *
10. */
11. public class PageBean {
12. private int pageCode; // 当前页码，由jsp页面传回
13. private int totalPage; // 总页数，查询数据库的总条目 /每一页显示的条数
14. private int pageSize; // 每一页显示的记录数 为一个固定值
15. private List<Customer> datas;// 每一页的客户的数据
16. private int totalRecord;
17.  
18. // 直接返回总页数
19. public int getTotalPage() {
20. int totalPage = this.totalRecord /this.pageSize;
21. return this.totalRecord % this.pageSize == 0 ? totalPage : totalPage + 1;
22. }
23.  
24. public List<Customer> getDatas() {
25. return datas;
26. }
27.  
28. public void setDatas(List<Customer> datas) {
29. this.datas = datas;
30. }
31.  
32. public int getTotalRecord() {
33. return totalRecord;
34. }
35.  
36. public void setTotalRecord(int totalRecord) {
37. this.totalRecord = totalRecord;
38. }
39.  
40. // 构造方法设置参数变量
41.  
42. public PageBean(int pageCode, int totalRecord) {
43. super();
44. this.pageCode = pageCode; // 当前是第几页
45. this.totalRecord = totalRecord; // 从数据库种总共的记录数
46. this.pageSize = 10; // 每一页显示的个数固定为 10
47. }
48.  
49. public PageBean() {
50.  
51. }
52.  
53. public int getPageCode() {
54. return pageCode;
55. }
56.  
57. public void setPageCode(int pageCode) {
58. this.pageCode = pageCode;
59. }
60.  
61. public int getPageSize() {
62. return pageSize;
63. }
64.  
65. public void setPageSize(int pageSize) {
66. this.pageSize = pageSize;
67. }
68.  
69. }

【2】编写 PageDao.java  实现对数据库的操作

1. package cn.edu.aynu.rjxy.dao;
2.  
3. import java.sql.SQLException;
4. import java.util.List;
5.  
6. import org.apache.commons.dbutils.QueryRunner;
7. import org.apache.commons.dbutils.handlers.BeanListHandler;
8. import org.apache.commons.dbutils.handlers.ScalarHandler;
9.  
10. import cn.edu.aynu.rjxy.bean.Customer;
11. import cn.edu.aynu.rjxy.utils.JDBCUtils;
12.  
13. /**
14. * 处理关于分页显示 在数据库中的操作
15. *
16. * @author 子
17. *
18. */
19. public class PageDao {
20. public static QueryRunner queryRunner = new QueryRunner(
21. JDBCUtils.getDataSource());
22.  
23. // 得到总记录数
24. /**
25. * @return Customer 中的所有记录数
26. * @throws SQLException
27. */
28. public int getPageTotalRecord() throws SQLException {
29. String sql = "select count(*) from customer "; // 拿到这个表的总行数
30. // ScalarHandler 用于获取结果集中第一行某列的数据并转换成 T 表示的实际对象。
31. // ScalarHandler 的参数为空或null时，返回第一行第一列的数据
32. Long totalRecord = queryRunner.query(sql, new ScalarHandler<Long>());
33. return totalRecord.intValue();
34.  
35. }
36.  
37. // 得到一个页面的记录的客户数据
38.  
39. /**
40. * @param recoderStartIndex 当前页面中记录的起始记录号
41. * @param pagesize 当前页面需要显示的条目
42. * @return 一个List<Customer> 集合
43. * @throws SQLException
44. */
45. public List<Customer> getListCustomer(int recoderStartIndex, int pagesize)
46. throws SQLException {
47. String sql = "select * from customer limit ?,?";
48. List<Customer> datas = queryRunner.query(sql,
49. new BeanListHandler<Customer>(Customer.class),
50. recoderStartIndex, pagesize);
51.  
52. return datas;
53. }
54.  
55. }

【3】编写 PageService.java 实现分页显示业务逻辑

1. package cn.edu.aynu.rjxy.service;
2.  
3. import java.sql.SQLException;
4. import java.util.List;
5.  
6. import javax.servlet.jsp.tagext.PageData;
7.  
8. import cn.edu.aynu.rjxy.bean.Customer;
9. import cn.edu.aynu.rjxy.bean.PageBean;
10. import cn.edu.aynu.rjxy.dao.PageDao;
11.  
12. /**
13. * 处理分页的业务逻辑
14. *
15. * @author 子
16. *
17. */
18. public class PageService {
19. public static PageDao pageDao = new PageDao();
20.  
21. // 分页查询客户业务
22. /**
23. * @param pageCode
24. * @return
25. * @throws SQLException
26. */
27. public PageBean getPageBean(int pageCode) throws SQLException {
28. // 总记录数
29. int pageTotalRecord = pageDao.getPageTotalRecord();
30. //
31. PageBean bean = new PageBean(pageCode, pageTotalRecord);
32.  
33. List<Customer> listCustomerdatas = pageDao.getListCustomer(
34. (pageCode - 1) * bean.getPageSize(), bean.getPageSize());
35.  
36.  
37. bean.setDatas(listCustomerdatas);
38.  
39. return bean;
40. }
41.  
42. }

【4】编写servlet执行doPost 或者 doGet 方法

1. public void query(HttpServletRequest request, HttpServletResponse response)
2. throws ServletException, IOException, SQLException {
3. // //执行查询客户业务
4. // List<Customer> list = cs.queryAll();
5. int pagecode = 1;
   1. // 获取pagecode 参数
6. String s = request.getParameter("pagecode");
7. if (s != null) {
   1. //解析为 int 类型
8. pagecode = Integer.parseInt(s);
9. }
   1. // 执行pageService 的业务方法拿到 pageBean对象
10. PageBean pageBean = pageService.getPageBean(pagecode);
11.  
12. int totalPage = pageBean.getTotalPage();
13. // 将list存放到request域中
14. request.setAttribute("pageBean", pageBean);
15. // 通过请求转发将查询结果带到list.jsp页面上显示
16. request.getRequestDispatcher("/jsp/list.jsp")
17. .forward(request, response);
18.  
19. }

【5】jsp 页面 主要针对 页码的 变化，几种情况做出处理。

1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
2. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
3.  
4.  
5. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
6. <html>
7. <head>
8. <title>list.jsp</title>
9. </head>
10.  
11. <body style="text-align: center;">
12. <h3>客户列表</h3>
13. <table border="1" align="center" width="60%">
14. <tr>
15. <th>客户姓名</th>
16. <th>客户性别</th>
17. <th>客户生日</th>
18. <th>客户手机</th>
19. <th>客户邮箱</th>
20. <th>客户描述</th>
21. <th>操作</th>
22. </tr>
23. <c:forEach items="${pageBean.datas}" var="c">
24. <tr>
25. <td>${c.cname }</td>
26. <td>${c.gender }</td>
27. <td>${c.birthday }</td>
28. <td>${c.cellphone }</td>
29. <td>${c.email }</td>
30. <td>${c.description }</td>
31. <td><a
32. href="<c:url value='/CustomerServlet?method=3&cid=${c.cid }'/>">编辑</a>
33. <a href="<c:url value='/CustomerServlet?method=5&cid=${c.cid }'/>"
34. onclick="return confirm('是否真要删除该客户？')">删除</a></td>
35. </tr>
36. </c:forEach>
37. </table>
38. 第${pageBean.pageCode}页/共${pageBean.totalPage}页
39. <!-- 首页 -->
40. <a href='<c:url value='/CustomerServlet?method=2&pagecode=1'></c:url>'>首页</a>
41. <!-- 上一页 -->
42. <c:if test="${pageBean.pageCode>1 }">
43. <!-- 当页码大于第一页 -->
44. <a
45. href='<c:url value='/CustomerServlet?method=2&pagecode=${pageBean.pageCode-1}'></c:url>'>上一页</a>
46. </c:if>
47.  
48. <!--【1】 【2】 页码显示 -->
49. <!-- 初始化页码 -->
50. <c:set var="begin" value="1"></c:set>
51. <c:set var="end" value="10"></c:set>
52.  
53. <!-- 在页码显示的当中会出现几种情况 -->
54. <!--第一种，如果总页码就小于10 那么只显示从开始到总页码就可以了 -->
55. <c:choose>
56. <c:when test="${pageBean.totalPage <=10}">
57. <c:set var="begin" value="1"></c:set>
58. <c:set var="end" value="${pageBean.totalPage}"></c:set>
59. </c:when>
60.  
61. <c:otherwise>
62. <!--第二种，页码大于10，但是在1-5页是不需要让页码发生变化的 -->
63. <!--第三种 页码大于10，但是在当前页码 +5 就大于了总页码，那么页码也不要变化了 -->
64. <c:choose>
65. <c:when test="${pageBean.pageCode - 4 <=1}">
66. <c:set var="begin" value="1"></c:set>
67. <c:set var="end" value="10"></c:set>
68. </c:when>
69.  
70. <c:when test="${pageBean.pageCode +5>=pageBean.totalPage }">
71. <c:set var="begin" value="${pageBean.totalPage -9 }"></c:set>
72. <!-- 起始页码就直接是 总页码-9 -->
73. <c:set var="end" value="${pageBean.totalPage }"></c:set>
74. </c:when>
75.  
76. <c:otherwise>
77. <!--第四种，是正常情况。 比如现在页码是第六页 ,起始页就是 第二页，最终页就是 第11页 -->
78. <c:set var="begin" value="${pageBean.pageCode-4}"></c:set>
79. <c:set var="end" value="${pageBean.pageCode+5 }"></c:set>
80. </c:otherwise>
81. </c:choose>
82. </c:otherwise>
83. </c:choose>
84.  
85.  
86.  
87.  
88. <c:forEach var="i" begin="${begin}" end="${end}">
89. <!-- 判断当前该页码是不是本页 -->
90. <c:choose>
91. <c:when test="${pageBean.pageCode == i}">${i}</c:when>
92. <c:otherwise>
93. <a
94. href='<c:url value='/CustomerServlet?method=2&pagecode=${i}'></c:url>'>${i}</a>
95. </c:otherwise>
96. </c:choose>
97. </c:forEach>
98.  
99.  
100.  
101. <!--下一页 -->
102. <c:if test="${pageBean.pageCode< pageBean.totalPage }">
103. <!-- 当前页码不大于最大的页码 -->
104. <a
105. href='<c:url value='/CustomerServlet?method=2&pagecode=${pageBean.pageCode+1 }'></c:url>'>下一页</a>
106. </c:if>
107. <a
108. href='<c:url value='/CustomerServlet?method=2&pagecode=${pageBean.totalPage}'></c:url>'>尾页</a>
109.  
110. </body>
111. </html>

源码：http://url.cn/41fa5QN

数据库：http://url.cn/41h85BO