javabean servlet jsp實現(xiàn)分頁功能代碼解析
更新時間：2016年09月18日 14:15:53 作者：pokid
這篇文章主要為大家詳細解析了javabean servlet jsp實現(xiàn)分頁功能代碼,具有一定的參考價值，感興趣的小伙伴們可以參考一下
前端實現(xiàn)用ligerUI實現(xiàn)分頁，感覺用框架確實簡單，閑著無聊，模擬著liger的分頁界面實現(xiàn)了一遍（只要是功能，樣式什么無視）
這里用基礎(chǔ)的三層架構(gòu)+servlet+jsp實現(xiàn)，思路很簡單，把所有分頁相關(guān)信息寫入到一個pagebean類里面，service返回這個bean類，每次分頁查詢時都從該bean里查找信息。只是其中的細節(jié)問題比較繁瑣，如邊界處理（前端和后臺邊界都要處理），下拉框跳轉(zhuǎn)后要顯示當(dāng)前頁等等
這是ligerUI實現(xiàn)的分頁樣式（實現(xiàn)過程我的上一篇博客有寫：http://www.dhdzp.com/article/92850.htm）
模擬實現(xiàn)過程：
目錄結(jié)構(gòu)
數(shù)據(jù)庫（mysql）
model層,一個數(shù)據(jù)庫對應(yīng)的model（Blog），還有一個pageBean(BlogPage)
import java.sql.Date;
public class Blog {
private int id;
private int category_id;
private String title;
private String content;
private Date created_time;
//getter和setter方法
@Override
public String toString() {
return "Blog [id=" + id + ", category_id=" + category_id + ", title=" + title + ", content=" + content
+ ", created_time=" + created_time + "]";
}
}
public class BlogPage {
private List<Blog> pagerecord;//每頁記錄
private int pageno;//當(dāng)前頁
private int pagenostart;//每頁開始索引
private int pagesize=5;//每頁多少數(shù)據(jù)
private int totalrecord;//總記錄數(shù)
private int totalpage;//總頁數(shù)
public BlogPage(int pageno,int totalrecord){
//pageno totalrecord都可以當(dāng)做已有信息
this.totalrecord=totalrecord;
//計算總頁數(shù)
totalpage=(totalrecord%pagesize==0)?totalrecord/pagesize:totalrecord/pagesize+1;
//pageno的邊界處理
if(pageno<=1)
this.pageno=1;
else if(pageno>=totalpage)
this.pageno=totalpage;
else
this.pageno=pageno;
//計算每頁開始索引，即每頁第一個數(shù)據(jù)的索引，用于分頁查詢
pagenostart=(this.pageno-1)*pagesize;
}
public int getPagenostart() {
return pagenostart;
}
public void setPagenostart(int pagenostart) {
this.pagenostart = pagenostart;
}
public List<Blog> getPagerecord() {
return pagerecord;
}
public void setPagerecord(List<Blog> pagerecord) {
this.pagerecord = pagerecord;
}
public int getPageno() {
return pageno;
}
public void setPageno(int pageno) {
this.pageno = pageno;
}
public int getPagesize() {
return pagesize;
}
public void setPagesize(int pagesize) {
this.pagesize = pagesize;
}
public int getTotalrecord() {
return totalrecord;
}
public void setTotalrecord(int totalrecord) {
this.totalrecord = totalrecord;
}
public int getTotalpage() {
return totalpage;
}
public void setTotalpage(int totalpage) {
this.totalpage = totalpage;
}
}
dao層
JDBCUtil封裝了jdbc的連接和釋放操作
public class JDBCUtil {
private static String url = "jdbc:mysql://localhost:3306/blogs_stu";
private static String username = "root";
private static String password = "";
static {
try {
Class.forName("com.mysql.jdbc.Driver");
} catch (Exception e) {
e.printStackTrace();
}
}
public static Connection getConnection(){
Connection conn;
try {
conn= DriverManager.getConnection(url, username, password);
return conn;
} catch (SQLException e) {
e.printStackTrace();
}
return null;
}
public static void release(ResultSet rs,PreparedStatement ps,Connection conn){
if(rs!=null){
try {
rs.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
if(ps!=null){
try {
ps.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
if(conn!=null){
try {
conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
}
public class BlogDao {
//每頁的記錄，傳入每頁開始索引和每頁大小用于分頁，即limit的兩個參數(shù)（mysql分頁用limit）
public List<Blog> getPageRecord(int pagenostart, int pagesize) {
Connection conn = JDBCUtil.getConnection();
PreparedStatement ps = null;
ResultSet rs = null;
String sql = "select * from blog limit ?,?";
List<Blog> list = new ArrayList<Blog>();
try {
ps = conn.prepareStatement(sql);
ps.setInt(1, pagenostart);
ps.setInt(2, pagesize);
rs = ps.executeQuery();
while (rs.next()) {
Blog blog = new Blog();
blog.setId(rs.getInt("id"));
blog.setCategory_id(rs.getInt("category_id"));
blog.setTitle(rs.getString("title"));
blog.setContent(rs.getString("content"));
blog.setCreated_time(rs.getDate("created_time"));
list.add(blog);
}
return list;
} catch (SQLException e) {
e.printStackTrace();
} finally {
JDBCUtil.release(rs, ps, conn);
}
return null;
}
//總記錄數(shù)
public int getTotal() {
Connection conn = JDBCUtil.getConnection();
PreparedStatement ps = null;
ResultSet rs = null;
try {
ps = conn.prepareStatement("select count(*) from blog");
rs = ps.executeQuery();
if (rs.next()) {
return rs.getInt(1);
}
} catch (SQLException e) {
e.printStackTrace();
} finally {
JDBCUtil.release(rs, ps, conn);
}
return 0;
}
}
service層
public class BlogService {
BlogDao blogDao = new BlogDao();
//返回pagebean,所有分頁需要的信息都去pagebean里查找
public BlogPage findPageRecord(int pageno) {
int totalrecord = blogDao.getTotal();
BlogPage blogpage = new BlogPage(pageno, totalrecord);
List<Blog> list = blogDao.getPageRecord(blogpage.getPagenostart(),blogpage.getPagesize());
blogpage.setPagerecord(list);
return blogpage;
}
}
servlet類
@WebServlet("/BlogSplitServlet")
public class BlogSplitServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html; charset=utf-8");
String pagenostr=request.getParameter("pageno");
//首次訪問servletpagenostr為null，給一個初始值，即默認訪問第一頁
int pageno=1;
if(pagenostr!=null)
pageno=Integer.parseInt(pagenostr);
BlogService service=new BlogService();
BlogPage blogPage=service.findPageRecord(pageno);
request.setAttribute("blogPage", blogPage);
request.getRequestDispatcher("/blogPage.jsp").forward(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
這樣所有的分頁信息就封裝到pagebean里了
jsp實現(xiàn)只需要將pagebean里的信息取出來就行了
下面給出我的jsp實現(xiàn)（模擬ligerUI）
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@page import="java.util.*,model.Blog,model.BlogPage"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript">
window.onload = function() {
//保證select的option與當(dāng)前頁顯示一致
select = document.getElementById("select");
pageno = '${blogPage.pageno}';
select.options[pageno - 1].selected = 'selected';
}
//select下拉列表跳轉(zhuǎn)
function selectjump() {
var pageno = select.selectedIndex + 1;
window.location.href = "http://localhost/jspPageSplit/BlogSplitServlet?pageno="
+ pageno;
}
//text跳轉(zhuǎn)，onblur事件，輸入框失去焦點是發(fā)生
function textjump() {
var pageno = document.getElementById("text").value;
window.location.href = "http://localhost/jspPageSplit/BlogSplitServlet?pageno="
+ pageno;
}
</script>
</head>
<body>
<%
BlogPage blogPage = (BlogPage) request.getAttribute("blogPage");
List<Blog> list = blogPage.getPagerecord();
// 尾頁填充空白行，若不填充，尾頁表格tr行數(shù)與前面不一致很難看
if (list.size() < blogPage.getPagesize()) {
for (int i = list.size(); i < blogPage.getPagesize(); i++)
list.add(null);
}
%>
<div style="width: 50%; height: 400px">
<table border="1" cellspacing="0" width="100%" bgcolor="#CEF0C5">
<tr height="40px">
<td>id</td><td>標(biāo)題</td><td>內(nèi)容</td><td>創(chuàng)建時間</td>
</tr>
<%
for (Blog blog : list) {
if (blog != null) {
%>
<tr height="50px">
<td width="10%"><%=blog.getId()%></td>
<td width="20%"><%=blog.getTitle()%></td>
<td width="40%"><%=blog.getContent()%></td>
<td width="30%"><%=blog.getCreated_time()%></td>
</tr>
<!-- 尾頁空白行填充 -->
<%} else {%>
<tr height="50px">
<td width="10%"></td>
<td width="20%"></td>
<td width="40%"></td>
<td width="30%"></td>
</tr>
<%}}%>
</table>
<div style="height:50px;background-color: #4B7DB3;line-height: 40px;">
<!-- select下拉框 -->
<select id="select">
<%for (int i = 1; i <= blogPage.getTotalpage(); i++) {%>
<option onclick="selectjump()"><%=i%></option>
<%}%>
</select>
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=1">首頁</a>
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=<%=blogPage.getPageno()-1<1?blogPage.getPageno():blogPage.getPageno()-1%>">上一頁</a>
<input type="text" id="text" size="1px" value="${blogPage.pageno}" onblur="textjump()">/${blogPage.totalpage}
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=<%=blogPage.getPageno()+1>blogPage.getTotalpage()?blogPage.getPageno():blogPage.getPageno()+1%>">下一頁</a>
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=<%=blogPage.getTotalpage()%>">尾頁</a>
<div style="float: right;">
顯示從${blogPage.pagenostart+1}到${blogPage.pageno==blogPage.totalpage?blogPage.totalrecord:blogPage.pagesize},
共${blogPage.totalrecord}條. 每頁顯示${blogPage.pagesize}條
</div>
</div>
</div>
</body>
</html>
這是最后的樣子，樣式粗略的調(diào)了下，功能跟ligerUI默認的分頁一模一樣
將JSP中代碼改為標(biāo)簽（JSTL，需引入相應(yīng)的jar包）并將JSP中的尾頁補白放在servlet中后
servlet中加入
// 尾頁填充空白行，若不填充，尾頁表格tr行數(shù)與前面不一致很難看
List<Blog> list = blogPage.getPagerecord();
if (list.size() < blogPage.getPagesize()) {
for (int i = list.size(); i < blogPage.getPagesize(); i++)
list.add(null);
}
blogPage.setPagerecord(list);
jsp頁面
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@page import="java.util.*,model.Blog,model.BlogPage"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Insert title here</title>
<script type="text/javascript">
//select下拉列表跳轉(zhuǎn)
function selectjump() {
var select = document.getElementById("select");
var pageno = select.selectedIndex + 1;
window.location.href = "http://localhost/jspPageSplit/BlogSplitServlet?pageno="
+ pageno;
}
//text跳轉(zhuǎn)，onblur事件，輸入框失去焦點時發(fā)生
function textjump() {
var pageno = document.getElementById("text").value;
window.location.href = "http://localhost/jspPageSplit/BlogSplitServlet?pageno="
+ pageno;
}
</script>
</head>
<body>
<div style="width: 50%; height: 400px">
<table border="1" cellspacing="0" width="100%" bgcolor="#CEF0C5">
<tr height="40px">
<td>id</td><td>標(biāo)題</td><td>內(nèi)容</td><td>創(chuàng)建時間</td>
</tr>
<c:forEach items="${blogPage.pagerecord}" var="c" varStatus="vs">
<c:if test="${c!=null}">
<tr height="50px">
<td width="10%">${c.id}</td>
<td width="20%">${c.title}</td>
<td width="40%">${c.content}</td>
<td width="30%">${c.created_time}</td>
</tr>
</c:if>
<!-- 尾頁空白行填充 -->
<c:if test="${c==null}">
<tr height="50px">
<td width="10%"></td>
<td width="20%"></td>
<td width="40%"></td>
<td width="30%"></td>
</tr>
</c:if>
</c:forEach>
</table>
<div style="height:50px;background-color: #4B7DB3;line-height: 40px;">
<!-- select下拉框 -->
<select id="select">
<c:forEach begin="1" end="${blogPage.totalpage}" var="i">
<option value="${i}" onclick="selectjump()" ${blogPage.pageno==i?'selected="selected"':''}>${i}</option>
</c:forEach>
</select>
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=1">首頁</a>
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=${blogPage.pageno-1<1?blogPage.pageno:blogPage.pageno-1}">上一頁</a>
<input type="text" id="text" size="1px" value="${blogPage.pageno}" onblur="textjump()">/${blogPage.totalpage}
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=${blogPage.pageno+1>blogPage.totalpage?blogPage.pageno:blogPage.pageno+1}">下一頁</a>
<a href="${pageContext.request.contextPath}/BlogSplitServlet?pageno=${blogPage.totalpage}">尾頁</a>
<div style="float: right;">
顯示從${blogPage.pagenostart+1}到${blogPage.pageno==blogPage.totalpage?blogPage.totalrecord:blogPage.pagesize},
共${blogPage.totalrecord}條. 每頁顯示${blogPage.pagesize}條
</div>
</div>
</div>
</body>
</html>
實際運用中可以根據(jù)需求編寫jsp頁面，但是后臺代碼基本是通用的
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了java實現(xiàn)的各種排序算法代碼示例，比較全面，代碼親測可用，如有不足之處，歡迎留言指出。2017-10-10
這篇文章主要介紹了SpringBoot中的Bean的初始化與銷毀順序，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-02-02
這篇文章主要介紹了解決springcloud Zuul丟失Cookie的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-10-10
這篇文章主要介紹了Java Linkedlist原理及實例詳解,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-01-01
Java Collection和Collections的區(qū)別
本文主要介紹了Java Collection和Collections的區(qū)別,Collection?是表示集合的接口,而?Collections?是對集合進行操作的工具類,下面就來介紹一下具體用法,感興趣的可以了解一下2023-12-12
Java實戰(zhàn)之小蜜蜂擴音器網(wǎng)上商城系統(tǒng)的實現(xiàn)
這篇文章主要介紹了如何利用Java實現(xiàn)簡單的小蜜蜂擴音器網(wǎng)上商城系統(tǒng)，文中采用到的技術(shù)有JSP、Servlet?、JDBC、Ajax等，感興趣的可以動手試一試2022-03-03
這篇文章主要介紹了MyBatis使用動態(tài)表或列代碼解析，分享了相關(guān)代碼示例，小編覺得還是挺不錯的，具有一定借鑒價值，需要的朋友可以參考下2018-02-02
這篇文章主要介紹了Spring框架AOP面向切面編程的全面分析，文中附含詳細的示例代碼分析，有需要的朋友可以借鑒參考下，希望能夠有所幫助2021-09-09
這篇文章主要介紹了Java中實現(xiàn)分布式定時任務(wù),本文給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-01-01
這篇文章主要介紹了SpringBoot整合第三方技術(shù),包括整合Junit、整合Mybatis,本文通過實例代碼相結(jié)合給大家介紹的非常詳細，需要的朋友可以參考下2022-08-08