1 分页概念
把数据以分页形式展示
2 创建实体类 封装分页相关的所有数据
package com. zhiyou100. entity ;
import java. util. List ;
public class FenYeBean < T > {
private Integer pageNumber;
private Integer count;
private Integer pageSize;
private List < T > list;
public Integer getPageNumber ( ) {
return pageNumber;
}
public void setPageNumber ( Integer pageNumber) {
this . pageNumber = pageNumber;
}
public Integer getCount ( ) {
return count;
}
public void setCount ( Integer count) {
this . count = count;
}
public Integer getPageTotal ( ) {
return count/ pageSize+ count% pageSize== 0 ? 0 : 1 ;
}
public Integer getPageSize ( ) {
return pageSize;
}
public void setPageSize ( Integer pageSize) {
this . pageSize = pageSize;
}
public Integer getStartIndex ( ) {
return ( pageNumber- 1 ) * pageSize;
}
public List < T > getList ( ) {
return list;
}
public void setList ( List < T > list) {
this . list = list;
}
@Override
public String toString ( ) {
return "FenYeBean [pageNumber=" + pageNumber + ", count=" + count + ", pageTotal=" + getPageTotal ( ) + ", pageSize="
+ pageSize + ", startIndex=" + getStartIndex ( ) + ", list=" + list + "]" ;
}
public FenYeBean ( ) {
super ( ) ;
}
}
3 修改dao:添加方法
public List < Student > getAll ( int startIndex, int pageSize) {
Connection con = JdbcUtil . getCon ( ) ;
PreparedStatement pre = null ;
ResultSet set = null ;
List < Student > list = new ArrayList < Student > ( ) ;
try {
pre = con. prepareStatement ( "select * from student limit ?,?" ) ;
pre. setInt ( 1 , startIndex) ;
pre. setInt ( 2 , pageSize) ;
set = pre. executeQuery ( ) ;
while ( set. next ( ) ) {
list. add ( new Student ( set. getInt ( "sid" ) , set. getString ( "sname" ) , set. getString ( "sex" ) ,
set. getFloat ( "score" ) , set. getDate ( "sbirth" ) , set. getBoolean ( "sdy" ) , set. getString ( "sphoto" ) ) ) ;
}
} catch ( Exception e) {
throw new RuntimeException ( e) ;
}
JdbcUtil . close ( con, pre, set) ;
return list;
}
public int getCount ( ) {
Connection con = JdbcUtil . getCon ( ) ;
PreparedStatement pre = null ;
ResultSet set = null ;
int count= 0 ;
try {
pre = con. prepareStatement ( "select count(*) con from student" ) ;
set = pre. executeQuery ( ) ;
if ( set. next ( ) ) {
count= set. getInt ( "con" ) ;
}
} catch ( Exception e) {
throw new RuntimeException ( e) ;
}
JdbcUtil . close ( con, pre, set) ;
return count;
}
4 创建分页的servlet: /student/getAllFenYe.do
package com. zhiyou100. servlet ;
import java. io. IOException ;
import java. util. List ;
import javax. servlet. ServletException ;
import javax. servlet. http. HttpServlet ;
import javax. servlet. http. HttpServletRequest ;
import javax. servlet. http. HttpServletResponse ;
import com. zhiyou100. dao. StudentDao ;
import com. zhiyou100. entity. FenYeBean ;
import com. zhiyou100. entity. Student ;
public class StudentGetAllFenYe extends HttpServlet {
protected void doGet ( HttpServletRequest req, HttpServletResponse resp) throws ServletException , IOException {
FenYeBean < Student > fenYeBean= new FenYeBean < Student > ( ) ;
int pageNumber= 1 ;
if ( req. getParameter ( "pageNumber" ) != null ) {
pageNumber= Integer . parseInt ( "pageNumber" ) ;
}
StudentDao studentDao= new StudentDao ( ) ;
fenYeBean. setPageSize ( 5 ) ;
int count= studentDao. getCount ( ) ;
fenYeBean. setCount ( count) ;
pageNumber= pageNumber<= 0 ? 1 : pageNumber;
pageNumber= pageNumber> fenYeBean. getPageTotal ( ) ? fenYeBean. getPageTotal ( ) : pageNumber;
fenYeBean. setPageNumber ( pageNumber) ;
List < Student > list= studentDao. getAll ( fenYeBean. getStartIndex ( ) , fenYeBean. getPageSize ( ) ) ;
fenYeBean. setList ( list) ;
req. setAttribute ( "fenYeBean" , fenYeBean) ;
req. getRequestDispatcher ( "/jsp/student/manager_fenye.jsp" ) . forward ( req, resp) ;
}
. . . .
}
5 创建jsp:/jsp/student/manager_fenye.jsp
<%@page import="org.apache.jasper.tagplugins.jstl.core.ForEach"%>
<%@page import="com.zhiyou100.entity.Student"%>
<%@page import="java.util.List"%>
<%@page import="com.zhiyou100.entity.Teacher"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<! 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" >
< link type = " text/css" rel = " stylesheet" href = " <c:url value=' /css/app.css' />" />
< style type = " text/css" >
#tab_student_list {
width : 1100px;
margin : 10px auto;
}
img {
width : 100px;
height : 100px;
}
</ style>
< title> 学生管理页面</ title>
</ head>
< body>
< h3 style = " color : blue; " > 当前登陆者:${sessionScope.teacher.tname} |
< a href = " <c:url value=' /' />teacher/logout.do" > 登出</ a>
</ h3>
< c: if test = " ${not empty requestScope.message}" >
< h3> ${message}</ h3>
</ c: if>
--%>
< c: if test = " ${empty requestScope.fenYeBean}" >
< jsp: forward page = " /student/getAllFenYe.do" />
</ c: if>
< table id = " tab_student_list" >
< tr> < th> 学号</ th> < th> 名字</ th> < th> 性别</ th> < th> 分数</ th> < th> 生日</ th> < th> 政治</ th> < th> 头像</ th> < th> 操作</ th> </ tr>
< c: forEach items = " ${requestScope.fenYeBean.list}" var = " stu" >
< tr>
< td> ${stu.sid}</ td>
< td> ${stu.sname}</ td>
< td> ${stu.sex}</ td>
< td> ${stu.score}</ td>
< td> < fmt: formatDate value = " ${stu.sbirth}" pattern = " yyyy年MM月dd日" /> </ td>
< td>
< c: choose>
< c: when test = " ${stu.sdy}" >
党员
</ c: when>
< c: otherwise>
群众
</ c: otherwise>
</ c: choose>
</ td>
< td> < img src = " <c:url value=' /imgs/${stu.sphoto}' />" onclick = " downloadImg ( '${stu.sphoto}' ) " /> </ td>
< td> < a href = " <c:url value=' /' />jsp/student/updateOne.jsp?sid=${stu.sid}" > 修改</ a> | < a href = " <c:url value=' /' />student/delete.do?sid=${stu.sid}" > 删除</ a> </ td>
</ tr>
</ c: forEach>
< tr> < th colspan = " 7" > < a href = " <c:url value=' /' />jsp/student/addOne.jsp" > 添加学生</ a> </ th> </ tr>
</ table>
< script type = " text/javascript" >
function downloadImg ( imgName ) {
location. href= "<c:url value='/student/downlaodSphoto.do?sphoto='/>" + imgName;
}
</ script>
</ body>
</ html>
修改登录成功后跳转的页面时manager_fenye.jsp而不再是manager.jsp 测试
6 在manager_fenye.jsp中添加页码的选择
6.1 效果如下
6.2 更改manager_fenye.jsp
<%@page import="org.apache.jasper.tagplugins.jstl.core.ForEach"%>
<%@page import="com.zhiyou100.entity.Student"%>
<%@page import="java.util.List"%>
<%@page import="com.zhiyou100.entity.Teacher"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<! 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" >
< link type = " text/css" rel = " stylesheet" href = " <c:url value=' /css/app.css' />" />
< style type = " text/css" >
#tab_student_list {
width : 1100px;
margin : 10px auto;
}
img {
width : 100px;
height : 100px;
}
div {
font-size : 20px;
font-weight : bold;
padding : 5px;
}
#div_fenye {
width : 1100px;
margin : 10px auto;
text-align : center;
height : 60px;
}
.div_fenye_li {
float : left;
margin : 10px;
background-color : #cccccc;
}
</ style>
< title> 学生管理页面</ title>
</ head>
< body>
...
< div id = " div_fenye" >
< c: if test = " ${requestScope.fenYeBean.pageNumber ne 1}" >
< div class = " div_fenye_li" onmouseover = " changeBGC ( this , 1 ) " onmouseout = " changeBGC ( this , 0 ) " onclick = " changePageNumber ( ${ requestScope. fenYeBean. pageNumber- 1 } ) " > < 上一页</ div>
</ c: if>
< c: forEach begin = " 1" end = " ${requestScope.fenYeBean.pageTotal}" var = " pn" >
< div class = " div_fenye_li" onmouseover = " changeBGC ( this , 1 ) " onmouseout = " changeBGC ( this , 0 ) " onclick = " changePageNumber ( ${ pn} ) " > ${pn} </ div>
</ c: forEach>
< c: if test = " ${requestScope.fenYeBean.pageNumber ne requestScope.fenYeBean.pageTotal}" >
< div class = " div_fenye_li" onmouseover = " changeBGC ( this , 1 ) " onmouseout = " changeBGC ( this , 0 ) " onclick = " changePageNumber ( ${ requestScope. fenYeBean. pageNumber+ 1 } ) " > 下一页 > </ div>
</ c: if>
</ div>
< script type = " text/javascript" >
function changeBGC ( node, n ) {
if ( n) {
node. style. backgroundColor= "#0033ff" ;
} else {
node. style. backgroundColor= "#cccccc" ;
}
}
function changePageNumber ( n ) {
alert ( n) ;
location. href= "<c:url value='/student/getAllFenYe.do?pageNumber='/>" + n;
}
</ script>
</ body>
</ html>