1.實體工具類
/** * 分頁工具類.泛型類 */ public class PageUtil<T> { //屬性 private int pageNumber;//總記錄數 private int pageCount;//總頁數 private int pageIndex;//當前頁 private int pageSize;//每頁大小 private List<T> list;//當前頁的數據 public int getPageNumber() { return pageNumber; } public int getPageCount() { return pageCount; } public int getPageIndex() { return pageIndex; } public int getPageSize() { return pageSize; } public List<T> getList() { return list; } public void setPageNumber(int pageNumber) { this.pageNumber = pageNumber; } public void setPageCount(int pageCount) { this.pageCount = pageCount; } public void setPageIndex(int pageIndex) { this.pageIndex = pageIndex; } public void setPageSize(int pageSize) { this.pageSize = pageSize; } public void setList(List<T> list) { this.list = list; } }
2.分頁顯示controller
// 分頁顯示列表 @RequestMapping("list") public ModelAndView list(HttpServletRequest request, Model model,HttpSession session,@RequestParam(value="name",required=false) String name) { System.out.println("--------------------+"+name+"++------------------------"); session.setAttribute("name", name); int pageIndex = 1;// 設置初始的當前頁，頁面顯示的都是第一頁 int pageSize = 5;// 設置每一頁顯示幾條數據,用於計算總頁數，此處設置的值必須與sql語句的limit最后的數值一樣 System.out.println("員工列表"); PageUtil<Member> pageUtil = new PageUtil<Member>();// 初始化工具類 if (request.getParameter("pageIndex") != null) { pageIndex = Integer.parseInt(request.getParameter("pageIndex")); } // 對頁面上的分頁標簽傳的值,進行獲取,也是就點擊'上一頁或者下一頁'傳過來的pageindex pageUtil.setPageIndex(pageIndex);// 保存至工具類，當前頁數 int number = memberBiz.getRowCount();// 調用service層方法計算出總數據量，就是多少條數據. //System.out.println("------------------------------"+number); pageUtil.setPageNumber(number);// 保存至工具類,總記錄數 pageUtil.setPageSize(pageSize);// 保存至工具類，一頁幾條 pageUtil.setPageCount((int) Math.ceil((double) (pageUtil.getPageNumber() / pageUtil.getPageSize())) + 1);// 計算出總頁數,並封裝到工具類 int index = (pageIndex - 1) * pageSize;// 計算出每一頁從數據庫中第幾條數據開始取值，也就是limit后面的第一個數字 List<Member> list = memberBiz.findAllMember(name, index);// 調用service層的方法，取得數據庫中的值 pageUtil.setList(list);// 保存到工具類中的集合 model.addAttribute("pageUtil", pageUtil);// 傳遞到頁面，存入值棧中 model.addAttribute("members", list); //System.out.println("-------------------------"); //System.out.println(list); return new ModelAndView("memberlist");// 跳轉的相關頁面 }
3.前端jsp頁面
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> <% pageContext.setAttribute("APP_PATH", request.getContextPath()); %> <html> <head> <meta charset="utf-8"> <title>管理員查看</title> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"> <link rel="stylesheet" type="text/css" href="${APP_PATH }/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="${APP_PATH }/css/bootstrapValidator.css"> <style> .table_div{ width:90%; margin:0 auto;} </style> <script type="text/javascript"> function delete_alert() { alert("您確定刪除？") } </script> </head> <body class="table-responsive" ><!-- style="margin: 30px" --> <!--面包屑導航--> <div> <ul class="breadcrumb"> <li><a href="${pageContext.request.contextPath}/adminholle.jsp">首頁</a></li> <li class="active">用戶管理</li> </ul> </div> <div class="row search" > <div class="col-md-6"> <form action="${pageContext.request.contextPath}/member/list.do" method="post"> <div class="input-group" style="width: 300px"> <input type="text" class="form-control" name="name" value="${name}" placeholder="請輸入要查詢的用戶名..."> <span class="input-group-btn"> <button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span> 查詢</button> </span> </div> </form> </div> <div class="text-right" style="width: 87%;height: 30px;"> <a class="btn btn-success active btn-xs" id="add_btn" href="${pageContext.request.contextPath}/memberadd.jsp">添加</a> </div> </div> <%-- <div class="text-right" style="width: 87%;height: 30px;"> <a class="btn btn-success active btn-xs" id="add_btn" href="${pageContext.request.contextPath}/adminsave.jsp">添加</a> </div> --%> <!--table表單層--> <div class="table_div"> <table class="table table-striped table-bordered table-hover" width="1200px" > <thead> <tr> <th align="center">會員編號</th> <th align="center">用戶名</th> <th align="center">密 碼</th> <th align="center">姓名</th> <th align="center">性別</th> <th align="center">身份證號</th> <th align="center">移動電話</th> <th align="center">Email</th> <th align="center">住址</th> <th align="center">操作</th> </tr> </thead> <tbody> <tr> <c:forEach var="members" items="${members}"> <tr> <td align="center">${members.id}</td> <td align="center">${members.username}</td> <td align="center">${members.password}</td> <td align="center">${members.name}</td> <td align="center">${members.sex}</td> <td align="center">${members.idNumber}</td> <td align="center">${members.phone}</td> <td align="center">${members.email}</td> <td align="center">${members.address}</td> <td align="center"> <a class="btn btn-danger active btn-xs" onclick="delete_alert()" href="${pageContext.request.contextPath}/member/delete.do?id=${members.id}">刪除</a> <a class="btn btn-info active btn-xs" href="${pageContext.request.contextPath}/member/updateselect.do?id=${members.id}">修改</a> </td> </tr> </c:forEach> </tr> </tbody> </table> <div style="width: 79%;height:2px;"> <!--頁數顯示--> 共<font size="3" color="red">${pageUtil.pageNumber}</font>條,當前第<font size="3" color="red">${pageUtil.pageIndex}</font>頁 </div> <!--分頁--> <div style="width: 93%;" class="text-right"> <ul class="pagination" > <li><a href="${APP_PATH }/member/list.do?pageIndex=1" >首頁</a></li> <li><a href="${APP_PATH }/member/list.do?pageIndex=${pageUtil.pageIndex>1?pageUtil.pageIndex-1:1}" class='pre'>上一頁</a></li> <c:forEach begin="1" end="${pageUtil.pageCount}" var="i"> <li><a href="${APP_PATH }/member/list.do?pageIndex=${i}" style="text-decoration: none;">${i}</a></li> </c:forEach> <li><a href="${APP_PATH }/member/list.do?pageIndex=${pageUtil.pageIndex<pageUtil.pageCount?pageUtil.pageIndex+1:pageUtil.pageCount}" class='next'>下一頁</a></li> <li><a href="${APP_PATH }/member/list.do?pageIndex=${pageUtil.pageCount}" class='last' >末頁</a></li> </ul> </div> </div> <script type="text/javascript" src="${APP_PATH }/js/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="${APP_PATH }/js/bootstrap.min.js"></script> </body> </html>
4.數據庫 dao層 service 省略