Bootstrap和Java分页实例第一篇
关于此文
bootstrap是前端很流行的框架,正在开发的项目,用bootstrap搭建起来的页面,自我感觉很完美,终于告别了苍白无力的白花花的难看的……的页面了。哈哈。
现在遇到了bootstrap的分页与java后台结合起来的分页封装问题,对于我这个java菜鸟来说,包装分页还没玩过。故此,在网上找了这个。觉得很不错,所以决定记录到博客里面。
还没有实践,决定写完博客去实践。在上图。祝我成功吧!
此人的博客没找到,代码中有email地址。
pagination
定义了分页常用的属性,方法
package com.app.pagination; import java.util.list; /** * 通用分页接口 * @author: super.wwz@hotmail.com * @classname: pagination * @version: v0.1 * @param <t> */ public interface pagination<t> { /** * 判断是否是首页 * @return */ boolean isfirst(); /** * 判断是否是尾页 * @return */ boolean islast(); /** * 判断是否有上一页 * @return */ boolean isprevious(); /** * 判断是否有下一页 * @return */ boolean isnext(); /** * 获取上一页的页码 * @return */ int getpreviousindex(); /** * 获取下一页的页码 * @return */ int getnextindex(); /** * 获取当前页码 * @return */ int getpageindex(); /** * 获取当前页大小 * @return */ int getpagesize(); /** * 获取总页数 * @return */ int gettotalpages(); /** * 获取数据总行数 * @return */ int gettotalelements(); /** * 获取当前页的数据 * @return */ list<t> getcurrdata(); /** * 获取数字分页链接对象 * @return */ betweenindex getbetweenindex(); /** * 获取每页显示的分页链接数 * @return */ int getpagelinknumber(); /** * 设置每页的分页链接数量 * @param pagelinknumber */ void setpagelinknumber(int pagelinknumber); }
betweenindex
该接口负责获取分页链接的开始和结尾索引
package com.app.pagination; /** * 开始链接-结束链接 * @author: super.wwz@hotmail.com * @classname: betweenindex * @version: v0.1 */ public interface betweenindex { /** * 获取开始分页链接索引 * @return */ int getbeginindex(); /** * 获取结束分页链接索引 * @return */ int getendindex(); }
defaultpagination
pagination接口的默认实现类
package com.app.pagination.impl; import java.util.list; import com.app.pagination.betweenindex; import com.app.pagination.pagination; /** * pagination接口默认实现 * @author: super.wwz@hotmail.com * @classname: defaultpagination * @version: v0.1 * @param <t> */ public class defaultpagination<t> implements pagination<t> { private int totalelements; private int pagesize; private int totalpages; private int pageindex; private queryhandler<t> queryhandler; private list<t> currdata; private int pagelinknumber; public defaultpagination(int pageindex, int pagesize, queryhandler<t> queryhandler, int pagelinknumber) { this(pageindex, pagesize, queryhandler); setpagelinknumber(pagelinknumber); } public defaultpagination(int pageindex, int pagesize, queryhandler<t> queryhandler){ //初始化数据访问回调接口 this.queryhandler = queryhandler; //查询总行数 settotalelements(); //修正页大小 setpagesize(pagesize); //计算总页数: settotalpages(); //修正页码 setpageindex(pageindex); //查询当前页数据 setcurrdata(); } private void setcurrdata() { // todo auto-generated method stub this.currdata = queryhandler.getcurrdata(pageindex, pagesize); } private void setpageindex(int pageindex) { // todo auto-generated method stub if(pageindex < 1) { this.pageindex = 1; } else if(pageindex > totalpages) { this.pageindex = totalpages; } else { this.pageindex = pageindex; } } private void settotalpages() { // todo auto-generated method stub if(pagesize > 0) { /*//普通算法: this.totalpages = totalelements % pagesize == 0 ? totalelements / pagesize : (totalelements / pagesize) + 1;*/ //减一公式: this.totalpages = (totalelements + pagesize - 1) / pagesize; } } private void setpagesize(int pagesize) { // todo auto-generated method stub if(pagesize < 1) { this.pagesize = 1; } else if(pagesize > totalelements) { this.pagesize = totalelements; } else { this.pagesize = pagesize; } } private void settotalelements() { // todo auto-generated method stub this.totalelements = queryhandler.gettotalelements(); } @override public boolean isfirst() { // todo auto-generated method stub return pageindex == 1; } @override public boolean islast() { // todo auto-generated method stub return pageindex == totalpages; } @override public boolean isprevious() { // todo auto-generated method stub return pageindex > 1; } @override public boolean isnext() { // todo auto-generated method stub return pageindex < totalpages; } @override public int getpreviousindex() { // todo auto-generated method stub return isprevious() ? pageindex - 1 : 1; } @override public int getnextindex() { // todo auto-generated method stub return isnext() ? pageindex + 1 : totalpages; } @override public int getpageindex() { // todo auto-generated method stub return pageindex; } @override public int getpagesize() { // todo auto-generated method stub return pagesize; } @override public int gettotalpages() { // todo auto-generated method stub return totalpages; } @override public int gettotalelements() { // todo auto-generated method stub return totalelements; } @override public list<t> getcurrdata() { // todo auto-generated method stub return currdata; } @override public betweenindex getbetweenindex() { // todo auto-generated method stub return new betweenindex() { private int beginindex; private int endindex; { boolean isodd = pagelinknumber % 2 == 0; int val = pagelinknumber / 2; beginindex = pageindex - (isodd ? val - 1: val); endindex = pageindex + val; if(beginindex < 1) { beginindex = 1; endindex = pagelinknumber; } if(endindex > totalpages) { endindex = totalpages; beginindex = endindex - pagelinknumber + 1; } } @override public int getendindex() { // todo auto-generated method stub return endindex; } @override public int getbeginindex() { // todo auto-generated method stub return beginindex; } }; } @override public int getpagelinknumber() { // todo auto-generated method stub return pagelinknumber; } @override public void setpagelinknumber(int pagelinknumber) { // todo auto-generated method stub if (pagelinknumber < 0) { this.pagelinknumber = 0; } else if (pagelinknumber > totalpages) { this.pagelinknumber = totalpages; } else { this.pagelinknumber = pagelinknumber; } } }
queryhandler
用于defaultpagination实现类的查询回调接口
package com.app.pagination.impl; import java.util.list; /** * 分页查询回调接口 * @author: super.wwz@hotmail.com * @classname: queryhandler * @version: v0.1 * @param <t> */ public interface queryhandler<t> { /** * 获取数据总行数 * @return */ int gettotalelements(); /** * 获取当前页的数据 * @param pageindex * @param pagesize * @return */ list<t> getcurrdata(int pageindex, int pagesize); }
bookdaoimpl
bookdao的实现类(bookdao接口已经省略)
package com.app.dao.impl; import java.sql.sqlexception; import java.util.list; import org.apache.commons.dbutils.handlers.beanlisthandler; import org.apache.commons.dbutils.handlers.scalarhandler; import com.app.bean.book; import com.app.dao.basedao; import com.app.dao.bookdao; public class bookdaoimpl extends basedao implements bookdao { @override public int count() { // 查询数据总行数 string sql = "select count(1) from t_book"; try { return getqueryrunner().query(sql, new scalarhandler<integer>()); } catch (sqlexception e) { // todo auto-generated catch block e.printstacktrace(); } return 0; } @override public list<book> getbooks(int pageindex, int pagesize) { // 关于sqlserver的查询分页sql stringbuffer sql = new stringbuffer(); sql.append("select * from ("); sql.append(" select row_number() over(order by(id)) new_id,* from t_book"); sql.append(") t where new_id between ? and ?"); try { return getqueryrunner().query(sql.tostring(), new beanlisthandler<book>(book.class), pagesize * (pageindex - 1) + 1,pagesize * pageindex); } catch (sqlexception e) { // todo auto-generated catch block e.printstacktrace(); } return null; } }
bookserviceimpl
bookservice业务逻辑接口的实现类 (bookservice已经省略)
package com.app.service.impl; import java.util.list; import com.app.bean.book; import com.app.dao.bookdao; import com.app.dao.impl.bookdaoimpl; import com.app.pagination.pagination; import com.app.pagination.impl.defaultpagination; import com.app.pagination.impl.queryhandler; import com.app.service.bookservice; /** * 业务逻辑层查询分页数据示例 * @author: super.wwz@hotmail.com * @classname: bookserviceimpl * @version: v0.1 */ public class bookserviceimpl implements bookservice { private bookdao bookdao = new bookdaoimpl(); @override public pagination<book> getbooklist(int pageindex, int pagesize,int pagelinknumber) { // todo auto-generated method stub return new defaultpagination<book>(pageindex, pagesize, new queryhandler<book>() { @override public int gettotalelements() { // todo auto-generated method stub return bookdao.count(); } @override public list<book> getcurrdata(int pageindex, int pagesize) { // todo auto-generated method stub return bookdao.getbooks(pageindex, pagesize); } },pagelinknumber); } }
bookaction
有关图书的servlet控制器
package com.app.web.action; 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.app.bean.book; import com.app.pagination.pagination; import com.app.service.bookservice; import com.app.service.impl.bookserviceimpl; public class bookaction extends httpservlet { private static final long serialversionuid = 5275929408058702210l; private bookservice bookservice = new bookserviceimpl(); @override protected void service(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception { request.setcharacterencoding("utf-8"); response.setcharacterencoding("utf-8"); int pageindex = 1; int pagesize = 10; try { pageindex = integer.parseint(request.getparameter("pageindex")); pagesize = integer.parseint(request.getparameter("pagesize")); } catch (numberformatexception e) { e.printstacktrace(); } //6: 显示的分页链接个数 pagination<book> bookpagination = bookservice.getbooklist(pageindex, pagesize,6); request.setattribute("bookpagination", bookpagination); request.getrequestdispatcher("index.jsp").forward(request, response); } }
jsp
index.jsp
将pagiation应用到bootstrap上的简单示例bootstrap版本: 3.3.5
<%@ page language="java" import="java.util.*" pageencoding="utf-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <c:if test="${requestscope.bookpagination == null }"> <c:redirect url="bookaction?pageindex=1&pagesize=4"></c:redirect> </c:if> <!doctype html"> <html> <head> <title>图书信息列表</title> <!-- bootstrap v3.3.5 --> <link href="${pagecontext.request.contextpath}/bootstrap-3.3.5-dist/css/bootstrap.min.css" type="text/css" rel="stylesheet" charset="utf-8" /> <link id="bootstraptheme" href="${pagecontext.request.contextpath}/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css" type="text/css" rel="stylesheet" charset="utf-8" /> <script src="${pagecontext.request.contextpath}/bootstrap-3.3.5-dist/js/jquery.min.js" type="text/javascript" charset="utf-8"></script> <script src="${pagecontext.request.contextpath}/bootstrap-3.3.5-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div class="container"> <h2 class="page-header">图书信息</h2> <table class="table table-striped table-bordered table-hover"> <tr> <th>#</th> <th>图书名</th> <th>单价</th> </tr> <c:set var="bookpagination" value="${requestscope.bookpagination}"></c:set> <c:choose> <c:when test="${bookpagination.totalelements gt 0}"> <c:foreach var="book" items="${bookpagination.currdata}"> <tr> <td>${book.id }</td> <td>${book.name }</td> <td>${book.price }</td> </tr> </c:foreach> <td colspan="3" align="center"> <div class="btn-group" role="group"> <c:if test="${bookpagination.first}" var="isfirst"> <a class="btn btn-primary btn-sm" disabled="disabled" href="#">首页</a> <a class="btn btn-success btn-sm" disabled="disabled" href="#">上一页</a> </c:if> <c:if test="${not isfirst}"> <a class="btn btn-primary btn-sm" href="${pagecontext.request.contextpath}/bookaction?pageindex=1&pagesize=${bookpagination.pagesize}">首页</a> <a class="btn btn-success btn-sm" href="${pagecontext.request.contextpath}/bookaction?pageindex=${bookpagination.previousindex }&pagesize=${bookpagination.pagesize}">上一页</a> </c:if> <c:if test="${bookpagination.last }" var="islast"> <a class="btn btn-success btn-sm" disabled="disabled" href="#">下一页</a> <a class="btn btn-primary btn-sm" disabled="disabled" href="#">尾页</a> </c:if> <c:if test="${not islast}"> <a class="btn btn-success btn-sm" href="${pagecontext.request.contextpath}/bookaction?pageindex=${bookpagination.nextindex }&pagesize=${bookpagination.pagesize}">下一页</a> <a class="btn btn-primary btn-sm" href="${pagecontext.request.contextpath}/bookaction?pageindex=${bookpagination.totalpages }&pagesize=${bookpagination.pagesize}">尾页</a> </c:if> </div> </td> </c:when> <c:otherwise> <tr><td colspan="3">没有更多数据!</td></tr> </c:otherwise> </c:choose> </table> <center> <nav> <ul class="pagination"> <c:if test="${isfirst }"> <li class="disabled"> <a href="#" aria-label="previous"> <span aria-hidden="true">»上一页</span> </a> </li> </c:if> <c:if test="${not isfirst }"> <li> <a href="${pagecontext.request.contextpath}/bookaction?pageindex=${bookpagination.previousindex }&pagesize=${bookpagination.pagesize}" aria-label="previous"> <span aria-hidden="true">»上一页</span> </a> </li> </c:if> <c:if test="${bookpagination.pagelinknumber gt 0}"> <c:set var="betweenindex" value="${bookpagination.betweenindex}"></c:set> <c:foreach var="linkindex" begin="${betweenindex.beginindex}" end="${betweenindex.endindex}"> <c:if test="${linkindex eq bookpagination.pageindex}" var="iscurr"> <li class="active"><a href="#">${linkindex}</a></li> </c:if> <c:if test="${not iscurr}"> <li><a href="${pagecontext.request.contextpath}/bookaction?pageindex=${linkindex}&pagesize=${bookpagination.pagesize}" >${linkindex}</a></li> </c:if> </c:foreach> </c:if> <c:if test="${islast }"> <li class="disabled"> <a href="#" aria-label="next"> <span aria-hidden="true">下一页 »</span> </a> </li> </c:if> <c:if test="${not islast }"> <li> <a href="${pagecontext.request.contextpath}/bookaction?pageindex=${bookpagination.nextindex }&pagesize=${bookpagination.pagesize}" aria-label="next"> <span aria-hidden="true">下一页 »</span> </a> </li> </c:if> </ul> </nav> </center> </div> </body> </html>
实例数据
说明:
- 如果需要扩展分页功能, 请扩展pagiation接口以及其余实现类;
- 此外, 此分页不依赖任何数据库(重新实现queryhandler查询回调接口即可), 可适用于任何web项目中;
使用list 集合模拟数据库的使用示例:
package com.app.service.impl; import java.util.arraylist; import java.util.list; import com.app.bean.book; import com.app.pagination.pagination; import com.app.pagination.impl.defaultpagination; import com.app.service.bookservice; /** * 使用list<t>集合模拟数据库 * @author: super.wwz@hotmail.com * @classname: bookserviceimpl2 * @version: v0.1 */ public class bookserviceimpl2 implements bookservice { // private bookdao bookdao = new bookdaoimpl(); private static list<book> list = new arraylist<book>(); //初始化list<book>数据 static { list.add(new book(1, "书名1", 18)); list.add(new book(2, "书名2", 13)); list.add(new book(3, "书名3", 18)); list.add(new book(4, "书名4", 38)); list.add(new book(5, "书名5", 18)); list.add(new book(6, "书名6", 58)); list.add(new book(7, "书名7", 12)); list.add(new book(8, "书名8", 11)); list.add(new book(9, "书名9", 13)); list.add(new book(10, "书名10", 22)); list.add(new book(11, "书名11", 19)); list.add(new book(12, "书名12", 13)); list.add(new book(13, "书名13", 19)); list.add(new book(14, "书名14", 32)); } @override public pagination<book> getbooklist(int pageindex, int pagesize, int pagelinknumber) { return new defaultpagination<book>(pageindex, pagesize, new queryhandler<book>() { @override public int gettotalelements() { //return bookdao.count(); return list.size(); } @override public list<book> getcurrdata(int pageindex, int pagesize) { //return bookdao.list(pageindex, pagesize); int fromindex = (pageindex - 1) * pagesize; int endindex = fromindex + pagesize; endindex = endindex > list.size() ? list.size() : endindex; return list.sublist(fromindex, endindex); } }, pagelinknumber); } }
下一篇更精彩!
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
上一篇: 用户发现MIUI无法安装谷歌GMS服务 官方回应:合规原因不再支持
下一篇: Animated详解
推荐阅读
-
java计算两个日期之前的天数实例(排除节假日和周末)
-
Bootstrap CSS组件之分页(pagination)和翻页(pager)
-
Java中finally和return的关系实例解析
-
Bootstrap的aria-label和aria-labelledby属性实例详解
-
Java List分页功能实现代码实例
-
Java 动态加载jar和class文件实例解析
-
bootstrap模态框弹出和隐藏,动态改变中间内容的实例
-
Angular+Bootstrap+Spring Boot实现分页功能实例代码
-
AngularJS 与Bootstrap实现表格分页实例代码
-
Vue.js结合bootstrap前端实现分页和排序效果