建立数据库:
CREATE DATABASE emp; USE emp; -- 建立person表 CREATE TABLE person ( -- 生成一个流水号,观察显示的记录数 id int AUTO_INCREMENT NOT NULL PRIMARY KEY , -- 用户的登陆ID uid varchar(32) , -- 用户的真实姓名 name varchar(32) , -- 用户的登陆密码 password varchar(20) ) ;第一步:
能够显示出所有的记录:
<%@ page contentType="text/html;charset=gbk"%> <%@ page import="java.sql.*"%> <html> <head> <title>分页显示</title> </head> <center> <h1>人员列表</h1> <hr> <br> <% final String DBDRIVER="com.mysql.jdbc.Driver"; final String DBURL="jdbc:mysql://localhost:3306/emp"; final String DBUSER="root"; final String DBPASSWORD="sa"; Connection conn=null; %> <% try{ Class.forName(DBDRIVER); conn=DriverManager.getConnection(DBURL,DBUSER,DBPASSWORD); String sql="select id,uid,name,password from person"; PreparedStatement pstmt=conn.prepareStatement(sql); ResultSet rs=pstmt.executeQuery(); %> <table border="1" width="80%"> <tr> <td>编号</td> <td>登陆名称</td> <td>姓名</td> <td>密码</td> <td colspan="2">操作</td> </tr> <% int i=0; //判断是否有数据的标识,如果有数据继续执行,如果没有数据,为0 while(rs.next()){ i++; int id=rs.getInt(1); String uid=rs.getString(2); String name=rs.getString(3); String password=rs.getString(4); %> <tr> <td><%=id%></td> <td><%=uid%></td> <td><%=name%></td> <td><%=password%></td> <td>删除</td> <td>更新</td> </tr> <% } rs.close(); pstmt.close(); if(i==0){ //没有任何数据 %> <tr> <td colspan="6">没有任何数据!</td> </tr> <% } %> </table> <% }catch(Exception e){ %> <h2>系统出错!</h2> <% }finally{ conn.close(); } %> </center> <body> </body> </html>
第二步:
如果要控制每页显示的记录数:只要操作ResultSet即可;原先是whle(rs.next())会把所有的记录数显示出来,此时只要改成if(rs.next()),在外层套循环的次数(即显示的记录数),即可控制每页显示的记录数。
for(int x=0;x<lineSize;x++){ if(rs.next()){
还有一个重要的步骤就是如果要显示的是第N页的数据,则需要将前几页的数据空出去
for(int x=0;x<(currentPage-1)*linesize;x++){ rs.next(); //当前是第几页,就要把前几页的数据空出来,用rs.next()循环出去 }
第三步:
首页 上一页 下一页 尾页
用button进行控制,触发onClick事件,传递页数
采用script进行控制,进行页数的处理。
需要解决的问题是:
1,计算出总记录数数
String sql = "SELECT COUNT(id) from person" ; pstmt = conn.prepareStatement(sql) ; ResultSet rs = pstmt.executeQuery() ; if(rs.next()){ allRecorders = rs.getInt(1) ; //得到所有的记录数 }
2,计算总页数
//计算总页数 /*有如下情况: 总记录数是23条,23/每页显示的记录(10)=2,实际是要有三页的记录数 此时采用算法(allRecorders+lineSize-1)/lineSize */ pageSize=(allRecorders+lineSize-1)/lineSize;<%@ page contentType="text/html;charset=gbk"%>
<%@ page import="java.sql.*"%> <html> <head> <title>分页显示</title> </head> <center> <h1>人员列表</h1> <hr> <br> <%! final String jspUrl="list_person_false_03.jsp"; %> <% //定义分页变量 //1,定义每页要显示的记录数 int lineSize=10; //2,定义变量:当前是第几页 int currentPage=1; //计算总页数 int pageSize=0; // 总记录数/每页显示的记录数 int allRecorders=10; %> <% try{ //接受传过来的当前页 currentPage=Integer.parseInt(request.getParameter("cp")); }catch(Exception e){} %> <% final String DBDRIVER="com.mysql.jdbc.Driver"; final String DBURL="jdbc:mysql://localhost:3306/mldn"; final String DBUSER="root"; final String DBPASSWORD="sa"; Connection conn=null; %> <% try{ Class.forName(DBDRIVER); conn=DriverManager.getConnection(DBURL,DBUSER,DBPASSWORD); String sql="select count(id) from person"; //查询总记录数 PreparedStatement pstmt=null; pstmt=conn.prepareStatement(sql); ResultSet rs=pstmt.executeQuery(); if(rs.next()){ allRecorders=rs.getInt(1); //得到所有的记录数 } rs.close(); pstmt.close(); //计算总页数 /*有如下情况: 总记录数是23条,23/每页显示的记录(10)=2,实际是要有三页的记录数 此时采用算法(allRecorders+lineSize-1)/lineSize */ pageSize=(allRecorders+lineSize-1)/lineSize; sql="select id,uid,name,password from person"; pstmt=conn.prepareStatement(sql); rs=pstmt.executeQuery(); %> <script language="javascript"> function openPage(curpage){ //用隐藏文本框接受参数 document.spage.cp.value=curpage; //提交 document.spage.submit(); } </script> <form action="<%=jspUrl%>" name="spage"> <input type="button" value="首页" onClick="openPage(1)"> <input type="button" value="上一页" onClick="openPage(<%=currentPage-1%>)"> <input type="button" value="下一页" onClick="openPage(<%=currentPage+1%>)"> <input type="button" value="尾页" onClick="openPage(<%=pageSize%>)"> <input type="hidden" name="cp" value=""> </form> <table border="1" width="80%"> <tr> <td>编号</td> <td>登陆名称</td> <td>姓名</td> <td>密码</td> <td colspan="2">操作</td> </tr> <% int i=0; //判断是否有数据的标识,如果有数据继续执行,如果没有数据,为0 for(int x=0;x<(currentPage-1)*lineSize;x++){ rs.next(); //当前是第几页,就要把前几页的数据空出来,用rs.next()循环出去 } for(int x=0;x<lineSize;x++){ if(rs.next()){ i++; int id=rs.getInt(1); String uid=rs.getString(2); String name=rs.getString(3); String password=rs.getString(4); %> <tr> <td><%=id%></td> <td><%=uid%></td> <td><%=name%></td> <td><%=password%></td> <td>删除</td> <td>更新</td> </tr> <% } } rs.close(); pstmt.close(); if(i==0){ //没有任何数据 %> <tr> <td colspan="6">没有任何数据!</td> </tr> <% } %> </table> <% }catch(Exception e){ %> <h2>系统出错!</h2> <% }finally{ conn.close(); } %> </center> <body> </body> </html>
第四步:
显示出当前页和总页数;
如果按照之前的代码,会出现以下的情况
此时修改代码,主要是进行了按钮的使用问题,用disabled可以让按钮无法使用
<!--<%=currentPage==1?"disabled":""%>: 如果是首页,则按钮首页无法使用-->
<input type="button" value="首页" onClick="openPage(1)" <%=currentPage==1?"disabled":""%>> <!--<%=currentPage==1?"disabled":""%>: 如果是首页,则按钮上一页也无法使用--> <input type="button" value="上一页" onClick="openPage(<%=currentPage-1%>)" <%=currentPage==1?"disabled":""%>> <!--<%=currentPage==pageSize?"disabled":""%>: 如果是尾页,则按钮下一页也无法使用--> <input type="button" value="下一页" onClick="openPage(<%=currentPage+1%>)" <%=currentPage==pageSize?"disabled":""%>> <!--<%=currentPage==pageSize?"disabled":""%>: 如果是尾页,则按钮尾页也无法使用--> <input type="button" value="尾页" onClick="openPage(<%=pageSize%>)" <%=currentPage==pageSize?"disabled":""%>>第五步:
用下拉列表框选择页数:
触发onChange事件:
跳转到: <select name="selpage" onChange="selOpenPage()"> <% for(int x=0;x<=pageSize;x++){ %> <option value="<%=x%>" <%=currentPage==x?"selected":""%>><%=x%></option> <% } %> </select>function selOpenPage(){
document.spage.cp.value=document.spage.selpage.value; document.spage.submit(); }
完整代码
<%@ page contentType="text/html;charset=gbk"%> <%@ page import="java.sql.*"%> <html> <head> <title>分页显示</title> </head> <center> <h1>人员列表</h1> <hr> <br> <%! final String jspUrl="list_person_false_05.jsp"; %> <% //定义分页变量 //1,定义每页要显示的记录数 int lineSize=10; //2,定义变量:当前是第几页 int currentPage=1; //计算总页数 int pageSize=0; // 总记录数/每页显示的记录数 int allRecorders=10; %> <% try{ //接受传过来的当前页 currentPage=Integer.parseInt(request.getParameter("cp")); }catch(Exception e){} %> <% final String DBDRIVER="com.mysql.jdbc.Driver"; final String DBURL="jdbc:mysql://localhost:3306/mldn"; final String DBUSER="root"; final String DBPASSWORD="sa"; Connection conn=null; %> <% try{ Class.forName(DBDRIVER); conn=DriverManager.getConnection(DBURL,DBUSER,DBPASSWORD); String sql="select count(id) from person"; //查询总记录数 PreparedStatement pstmt=null; pstmt=conn.prepareStatement(sql); ResultSet rs=pstmt.executeQuery(); if(rs.next()){ allRecorders=rs.getInt(1); //得到所有的记录数 } rs.close(); pstmt.close(); //计算总页数 /*有如下情况: 总记录数是23条,23/每页显示的记录(10)=2,实际是要有三页的记录数 此时采用算法(allRecorders+lineSize-1)/lineSize */ pageSize=(allRecorders+lineSize-1)/lineSize; sql="select id,uid,name,password from person"; pstmt=conn.prepareStatement(sql); rs=pstmt.executeQuery(); %> <script language="javascript"> function openPage(curpage){ //用隐藏文本框接受参数 document.spage.cp.value=curpage; //提交 document.spage.submit(); } function selOpenPage(){ document.spage.cp.value=document.spage.selpage.value; document.spage.submit(); } </script> <form action="<%=jspUrl%>" name="spage"> <!--<%=currentPage==1?"disabled":""%>: 如果是首页,则按钮首页无法使用--> <input type="button" value="首页" onClick="openPage(1)" <%=currentPage==1?"disabled":""%>> <!--<%=currentPage==1?"disabled":""%>: 如果是首页,则按钮上一页也无法使用--> <input type="button" value="上一页" onClick="openPage(<%=currentPage-1%>)" <%=currentPage==1?"disabled":""%>> <!--<%=currentPage==pageSize?"disabled":""%>: 如果是尾页,则按钮下一页也无法使用--> <input type="button" value="下一页" onClick="openPage(<%=currentPage+1%>)" <%=currentPage==pageSize?"disabled":""%>> <!--<%=currentPage==pageSize?"disabled":""%>: 如果是尾页,则按钮尾页也无法使用--> <input type="button" value="尾页" onClick="openPage(<%=pageSize%>)" <%=currentPage==pageSize?"disabled":""%>> <input type="hidden" name="cp" value=""> <font color="red" size="5"><%=currentPage%></font> / <font color="red" size="5"><%=pageSize%></font> 跳转到: <select name="selpage" onChange="selOpenPage()"> <% for(int x=0;x<=pageSize;x++){ %> <option value="<%=x%>" <%=currentPage==x?"selected":""%>><%=x%></option> <% } %> </select> </form> <table border="1" width="80%"> <tr> <td>编号</td> <td>登陆名称</td> <td>姓名</td> <td>密码</td> <td colspan="2">操作</td> </tr> <% int i=0; //判断是否有数据的标识,如果有数据继续执行,如果没有数据,为0 for(int x=0;x<(currentPage-1)*lineSize;x++){ rs.next(); //当前是第几页,就要把前几页的数据空出来,用rs.next()循环出去 } for(int x=0;x<lineSize;x++){ if(rs.next()){ i++; int id=rs.getInt(1); String uid=rs.getString(2); String name=rs.getString(3); String password=rs.getString(4); %> <tr> <td><%=id%></td> <td><%=uid%></td> <td><%=name%></td> <td><%=password%></td> <td>删除</td> <td>更新</td> </tr> <% } } rs.close(); pstmt.close(); if(i==0){ //没有任何数据 %> <tr> <td colspan="6">没有任何数据!</td> </tr> <% } %> </table> <% }catch(Exception e){ %> <h2>系统出错!</h2> <% }finally{ conn.close(); } %> </center> <body> </body> </html>