JavaWeb学习-案例练习-图书管理前台-9-分页功能实现
前面一篇完成了多条件的查询，这篇开始学习分页，很多网页是默认显示20条数据，想看更多数据，就通过点击下一页的方式实现。这篇就来模拟这个分页实现过程。
1.项目环境准备
之前我们实现的都是图书管理后台功能，现在分页，我们在前端页面，所以我把素材中product_list.jsp和ad文件夹拷贝到Eclipse中的WebContent的目录下。product_list.jsp就是我们要实现分页的前端页面。
上图是项目工程结构，全部代码放在了github上。
https://github.com/Anthonyliu86/BookManagement_JavawebDemo
2.分页思路分析
当前product_list的效果是这样，布局是采用表格布局，一行显示四本书，也就是一个tr里面有4个td。
为了我们简单，这里我们只用一行，每行显示4本书，想看第五本书，必须点击下一页菜单。所以，我们在product_list.jsp中这个表格，只留下一个tr，第一行也只留下一个td，也就是一本书，最后效果是这样的。
下图是所有层交互的思路。
3.分页代码实现过程
在点击下一页之后，这个动作需要跳转到一个servlet，我们先来创建这个servlet，叫pageServlet。
3.1创建一个PageServlet.java
当前这个servlet代码是空，这个文件主要写设置每页显示个数，和当前页id获取，然后返回一个页面对象。所以，我们先创建一个关于页面的Bean类。
3.2创建PageBean.java
在domian包下创建一个PageBean.java文件，写入下面代码。
package com.anthony.domain;
import java.util.List;public class PageBean {private int pageSize;private int currentPage;private int count;private int totalPage;private List<Book> books;public int getPageSize() {return pageSize;}public void setPageSize(int pageSize) {this.pageSize = pageSize;}public int getCurrentPage() {return currentPage;}public void setCurrentPage(int currentPage) {this.currentPage = currentPage;}public int getCount() {return count;}public void setCount(int count) {this.count = count;}public int getTotalPage() {return totalPage;}public void setTotalPage(int totalPage) {this.totalPage = totalPage;}public List<Book> getBooks() {return books;}public void setBooks(List<Book> books) {this.books = books;}}3.3 Dao层代码
在BookDao这个接口中新增两个方法，一个是求总记录数，第二个是查找分页数据
/*** 得到总记录数* @return* @throws SQLException*/public int count() throws SQLException;/*** 查找分页数据* @param currentPage* @param pageSize* @return* @throws SQLException*/public List<Book> findBooks(int currentPage, int pageSize)throws SQLException;
然后在BookDaoImpl.java添加这两个方法的具体实现代码
public int count() throws SQLException {QueryRunner qr = new QueryRunner(C3P0Utils.getDataSource());long l = (Long)qr.query("select count(*) from book", new ScalarHandler(1));return (int)l;}public List<Book> findBooks(int currentPage, int pageSize) throws SQLException {QueryRunner qr = new QueryRunner(C3P0Utils.getDataSource());return qr.query("select * from book limit ?,?", new BeanListHandler<Book>(Book.class),(currentPage-1)*pageSize, pageSize);}
3.4 Service层
BookService接口添加根据currentPage和pageSize两个参数，得到PageBean的方法
public PageBean findBooksPage(int currentPage, int pageSize);具体方法实现，添加到BookServiceImpl.java
public PageBean findBooksPage(int currentPage, int pageSize) {try {int count = bd.count();int totalPage = (int)Math.ceil(count*1.0/pageSize);List<Book> books = bd.findBooks(currentPage, pageSize);//封装成一个PageBean对象PageBean pb = new PageBean();pb.setBooks(books);pb.setCount(count);pb.setCurrentPage(currentPage);pb.setTotalPage(totalPage);pb.setPageSize(pageSize);return pb;} catch (SQLException e) {e.printStackTrace();}return null;}
3.5 Servlet代码
回到PageServlet.java中，看看这个servlet如何写
package com.anthony.web.servlet;import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;import com.anthony.domain.PageBean;
import com.anthony.service.BookService;
import com.anthony.service.BookServiceImpl;public class PageServlet extends HttpServlet {protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//初始化每页显示记录数int pageSize = 4;int currentPage = 1; //表示当前页String currPage = request.getParameter("currentPage");if(currPage != null) { //第一次访问页面currPage可能为nullcurrentPage = Integer.parseInt(currPage);}//调用业务层方法BookService bs = new BookServiceImpl();//分页查询，并返回PageBean对象PageBean pb = bs.findBooksPage(currentPage, pageSize);//请求跳转request.setAttribute("pb", pb);request.getRequestDispatcher("/product_list.jsp").forward(request, response);}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}}
3.6 Product_list.jsp修改
3.6.1 添加JSTL约束
在product_list.jsp顶部添加JSTL约束
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
3.6.2 解析PageBean对象到jsp中
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><title>bookStore列表</title>
<%--导入css --%>
<link rel="stylesheet" href="css/main.css" type="text/css" />
</head><body class="main"><jsp:include page="head.jsp" /><jsp:include page="menu_search.jsp" /><div id="divpagecontent"><table width="100%" border="0" cellspacing="0"><tr><td><div style="text-align:right; margin:5px 10px 5px 0px"><a href="index.jsp">首页</a> > 计算机 > 图书列表</div><table cellspacing="0" class="listcontent"><tr><td><h1>商品目录</h1><hr /><h1>计算机</h1> 共100种商品<hr /><div style="margin-top:20px; margin-bottom:5px"><img src="data:images/productlist.gif" width="100%" height="38" /></div><table cellspacing="0" class="booklist"><tr><c:forEach items="${pb.books}" var="b"><td><div class="divbookpic"><p><a href="#"><img src="" width="115" height="129"border="0" /> </a></p></div><div class="divlisttitle"><a href="#">书名:${b.name}<br />售价:${b.price} </a></div></td><td></c:forEach></table><div class="pagination"><ul><li class="disablepage"><<上一页</li><li>第1页/共5页</li><li class="nextPage"><a href="#"><<下一页</a></li></ul></div></td></tr></table></td></tr></table></div><jsp:include page="foot.jsp" /></body>
</html>浏览器打开http://localhost:8080/BookManagement/pageServlet 效果是这样的
3.6.3 实现上一页和下一页功能
现在我们就差上一页和下一页这个功能没有实现。 下面代码主要看 上一页 和下一页中代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><title>bookStore列表</title>
<%--导入css --%>
<link rel="stylesheet" href="css/main.css" type="text/css" />
</head><body class="main"><jsp:include page="head.jsp" /><jsp:include page="menu_search.jsp" /><div id="divpagecontent"><table width="100%" border="0" cellspacing="0"><tr><td><div style="text-align:right; margin:5px 10px 5px 0px"><a href="index.jsp">首页</a> > 计算机 > 图书列表</div><table cellspacing="0" class="listcontent"><tr><td><h1>商品目录</h1><hr /><h1>计算机</h1> 共100种商品<hr /><div style="margin-top:20px; margin-bottom:5px"><img src="data:images/productlist.gif" width="100%" height="38" /></div><table cellspacing="0" class="booklist"><tr><c:forEach items="${pb.books}" var="b"><td><div class="divbookpic"><p><a href="#"><img src="" width="115" height="129"border="0" /> </a></p></div><div class="divlisttitle"><a href="#">书名:${b.name}<br />售价:${b.price} </a></div></td></c:forEach></table><div class="pagination"><ul><li class="disablepage"><a href="${pageContext.request.contextPath }/pageServlet?currentPage=${pb.currentPage-1}"><<上一页</a></li><li>第${pb.currentPage}页/共${pb.totalPage}页</li><li class="nextPage"><a href="${pageContext.request.contextPath }/pageServlet?currentPage=${pb.currentPage+1}"><<下一页</a></li></ul></div></td></tr></table></td></tr></table></div><jsp:include page="foot.jsp" /></body>
</html>分页效果如下
3.6.4 上一页和下一页边界处理
因为需要对上一页和下一页的边界判断，例如上一页边界情况，如果当前currentPage等于1，那么就上一页不能再减1。同样，当前currentPage等于totalPage，那么不能加1. 这种if判断，我们可以用三元运算符来一行代码搞定。
如果currentPage=1, 前端点击上一页，永远传递currentPage=1, 如果currentPage=totalPage，那么传递就是currentPage=totalPage,也就是最后一页。
<div class="pagination"><ul><li class="disablepage"><a href="${pageContext.request.contextPath }/pageServlet?currentPage=${pb.currentPage==1? pb.currentPage:pb.currentPage-1}"><<上一页</a></li><li>第${pb.currentPage}页/共${pb.totalPage}页</li><li class="nextPage"><a href="${pageContext.request.contextPath }/pageServlet?currentPage=${pb.currentPage==pb.totalPage? pb.currentPage:pb.currentPage+1}"><<下一页</a></li></ul></div>
到这来，分页功能全部实现。
JavaWeb学习-案例练习-图书管理前台-9-分页功能实现相关推荐
- JavaWeb学习-案例练习-图书管理前台-10- 图书详情页的实现
前面一篇实现了前端图书列表的分页操作,可以点击上一页和下一页,这个我们实现每个页面显示4本书,实际开发中,一般设置20条记录或者40条记录,这个实现原理是一样的.这篇来学习,在前端页面点击这本书的名称 ...
- JavaWeb学习-案例练习-图书管理后台-5- 完成图书删除功能
继续来做案例练习,本篇学习如何删除图书,也就是在list.jsp页面的图书列表中,点击删除按钮,这条图书记录信息就从列表消失,然后相当于刷新当前页面,列表就少了一条图书记录. 1.需求场景 例如把Py ...
- 案例：图书管理——补充知识（数组相关API）||补充知识（数组响应式变化）
案例:图书管理 Vue数组操作 1.变异方法:会影响数组的原始数据的变化. 2.替换数组:不会影响原始的数组数据,而是形成一个新的数组. <!DOCTYPE html> <html ...
- JavaWeb学习案例——学生管理系统
JavaWeb学习案例--学生管理系统 引入jar包: 1. c3p0-0.9.1.2.jar // 第三方数据库连接池 2.commons-dbutils-1.4.jar // 第三方数据库操作方法 ...
- 案例：图书管理（包括图书列表展示，添加、修改、删除图书功能）
案例:图书管理 功能如下: (1)图书列表 实现静态列表效果 基于数据实现模板效果 处理每行的操作按钮 (2)添加图书 实现表单的静态效果 添加图书表单域数据绑定 添加按钮事件绑定 实现添加业务逻辑 ...
- 用Python做一个控制台程序实现图书管理器的简单功能，例如添加图书、查询库里的图书、删除图书、修改书籍信息、显示书籍信息，或者是借阅/归还...
为了实现图书管理器的功能,需要考虑如下几点: 需要定义一个图书类,包含书名.作者.出版社.借阅状态.借阅人等属性,可以使用类的构造函数来初始化这些属性. 需要定义一个图书管理器类,包含一个用于存储图书 ...
- JavaWeb阶段案例--简易版管理图书系统（增删改查）
1. 创建数据库及数据表 #创建数据库jdbc CREATE DATABASE jdbc ;#打开数据库 USE jdbc ;#创建用户表 t_user CREATE TABLE t_user(id ...
- 用友U8案例教程库存管理前台操作
目录 一．采购入库操作 查询到货单 新增采购入库单 查询采购入库单 二．委外出库与入库操作 查询到货单 新增委外入库单 查询委外入库单 三．生产出库与入库操作 生产订单批量领料 产成品入库 四．销售出 ...
- 金蝶K3案例教程采购管理前台操作
目录 新增供应商 新增采购单价资料 查询采购申请 生成采购订单 查询采购订单 变更采购订单 生成收料通知单 查询收料通知单 新增供应商 案例 erplabs整机公司以下供应商,在ERP新增供应商资料 ...
最新文章
- libdgl.dll WinError 126
- VC防止程序被多次运行 互斥体方法
- 【算法】常用的排序方法
- NOI2021模拟测试赛 解题报告
- WebLogic调用WebService提示Failed to localize、Failed to create WsdlDefinitionFeature
- 02-02 Python 读写文件 open|os|sys
- python wlsxwriter_python xlsxwriter模块的使用
- java与自动化的应用实例_自动化测试中java多线程的使用实例
- Atitit 提升开发效率的方法 提升语言级别 目录 1. 提升语言级别到4gl 1 1.1. 语言的代际关系 sql 》script 》java 1 1.2. 使用4gl dsl语言与api 1
- 分享六：php脚本守护进程
- 英语句子组织的5个步骤
- kettle设置mysql时区_kettle中通过 时间戳（timestamp）方式 来实现数据库的增量同步操作（一）...
- Pettitt突变点检测
- python画猫hellokitty_如何用铅笔画HelloKitty? 原来是这样的
- [Go WebSocket] 为什么我选用Go重构Python版本的WebSocket服务？
- Python3正则表达式（慢慢更新中~）
- Unity3D一些项目经验
- 基于JSP的网络音乐KTV点歌电台网站
- 使用WMI provider创建进程
- 【理财】信托产品的发行和成立