javabean servlet jsp实现分页功能代码解析
程序员文章站
2024-03-13 15:43:21
前端实现用ligerui实现分页,感觉用框架确实简单,闲着无聊,模拟着liger的分页界面实现了一遍(只要是功能,样式什么无视)
这里用基础的三层架构+s...
前端实现用ligerui实现分页,感觉用框架确实简单,闲着无聊,模拟着liger的分页界面实现了一遍(只要是功能,样式什么无视)
这里用基础的三层架构+servlet+jsp实现,思路很简单,把所有分页相关信息写入到一个pagebean类里面,service返回这个bean类,每次分页查询时都从该bean里查找信息。只是其中的细节问题比较繁琐,如边界处理(前端和后台边界都要处理),下拉框跳转后要显示当前页等等
这是ligerui实现的分页样式(实现过程我的上一篇博客有写:)
模拟实现过程:
目录结构
数据库(mysql)
model层,一个数据库对应的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;//当前页 private int pagenostart;//每页开始索引 private int pagesize=5;//每页多少数据 private int totalrecord;//总记录数 private int totalpage;//总页数 public blogpage(int pageno,int totalrecord){ //pageno totalrecord都可以当做已有信息 this.totalrecord=totalrecord; //计算总页数 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; //计算每页开始索引,即每页第一个数据的索引,用于分页查询 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的两个参数(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; } //总记录数 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实现只需要将pagebean里的信息取出来就行了
下面给出我的jsp实现(模拟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与当前页显示一致 select = document.getelementbyid("select"); pageno = '${blogpage.pageno}'; select.options[pageno - 1].selected = 'selected'; } //select下拉列表跳转 function selectjump() { var pageno = select.selectedindex + 1; window.location.href = "http://localhost/jsppagesplit/blogsplitservlet?pageno=" + pageno; } //text跳转,onblur事件,输入框失去焦点是发生 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行数与前面不一致很难看 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>标题</td><td>内容</td><td>创建时间</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>
这是最后的样子,样式粗略的调了下,功能跟ligerui默认的分页一模一样
将jsp中代码改为标签(jstl,需引入相应的jar包)并将jsp中的尾页补白放在servlet中后
servlet中加入
// 尾页填充空白行,若不填充,尾页表格tr行数与前面不一致很难看 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下拉列表跳转 function selectjump() { var select = document.getelementbyid("select"); var pageno = select.selectedindex + 1; window.location.href = "http://localhost/jsppagesplit/blogsplitservlet?pageno=" + pageno; } //text跳转,onblur事件,输入框失去焦点时发生 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>标题</td><td>内容</td><td>创建时间</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>
实际运用中可以根据需求编写jsp页面,但是后台代码基本是通用的
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
上一篇: java图片验证码生成教程详解
下一篇: Jdbc的步骤以及简单实现代码
推荐阅读
-
javabean servlet jsp实现分页功能代码解析
-
javabean servlet jsp实现分页功能代码解析
-
javabean servlet jsp实现分页功能代码解析
-
JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)
-
JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)
-
Servlet+Jsp实现图片或文件的上传功能具体思路及代码
-
Servlet+Jsp实现图片或文件的上传功能具体思路及代码
-
jsp实现页面分页功能代码
-
jsp servlet javaBean后台分页实例代码解析
-
Servlet+Jsp实现图片或文件的上传功能具体思路及代码