急求一个jsp+ajax实现分页的例子
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了急求一个jsp+ajax实现分页的例子相关的知识,希望对你有一定的参考价值。
参考技术A 分页实现步骤:1. 将Page类引入。需要自己修改的可自行修改。
package com.puckasoft.video.util;
public class Page
private int num; //当前页号, 采用自然数计数 1,2,3,...
private int size; //页面大小:一个页面显示多少个数据
private int rowCount;//数据总数:一共有多少个数据
private int pageCount; // 页面总数
private int startRow;//当前页面开始行, 第一行是0行
private int first = 1;//第一页 页号
private int last;//最后页 页号
private int next;//下一页 页号
private int prev;//前页 页号
private int start;//页号式导航, 起始页号
private int end;//页号式导航, 结束页号
private int numCount = 10;//页号式导航, 最多显示页号数量为numCount+1;这里显示11页。
public Page(int size, String str_num, int rowCount)
int num = 1;
if (str_num != null)
num = Integer.parseInt(str_num);
this.num = num;
this.size=size;
this.rowCount = rowCount;
this.pageCount = (int) Math.ceil((double)rowCount/size);
this.num = Math.min(this.num, pageCount);
this.num = Math.max(1, this.num);
this.startRow = (this.num-1) * size ;
this.last = this.pageCount;
this.next = Math.min( this.pageCount, this.num+1);
this.prev = Math.max(1 , this.num-1);
//计算page 控制
start = Math.max(this.num-numCount/2, first);
end = Math.min(start+numCount, last);
if(end-start < numCount)
start = Math.max(end-numCount, 1);
// 为了节省篇幅,get,set方法省略。
2. 引入fenye.jsp / pagination.jsp文件:
<%@ page language="java" contentType="text/html; charset=GBK" pageEncoding="GBK"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
</head>
<body>
<%
String url4page = request.getParameter("url4page").trim();
url4page = (url4page.indexOf("?")==-1)?url4page+"?num=":url4page+"&num=";
%>
<c:choose>
<c:when test="$page.num != 1">
<a href="<%=url4page %>$page.first">首页</a>
<a href="<%=url4page %>$page.prev">前一页</a>
</c:when>
<c:otherwise>
<b>首页</b>
<b>前一页</b>
</c:otherwise>
</c:choose>
<c:forEach var="i" begin="$page.start" end="$page.end" step="1">
<c:choose>
<c:when test="$page.num != i">
<a href="<%=url4page %>$i"><b>[$i]</b>
</a>
</c:when>
<c:otherwise>
<b>[$i]</b>
</c:otherwise>
</c:choose>
</c:forEach>
<c:choose>
<c:when test="$page.num != page.pageCount">
<a href="<%=url4page %>$page.next">后一页</a>
<a href="<%=url4page %>$page.last">末页</a>
</c:when>
<c:otherwise>
<b>末页</b>
<b>后一页</b>
</c:otherwise>
</c:choose>
共$page.pageCount页
<br />
</body>
</html>
3. 在相应servlet/jsp 里面,将需要显示的记录放到list里面,并将list放到request或者session里面:相应servlet写法如下:
<%@ page language="java" import="java.util.*" pageEncoding="GBK" %>
<%@ page import="com.puckasoft.video.dao.*,com.puckasoft.video.vo.*,com.puckasoft.video.util.*" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
</head>
<body>
<%
//处理总记录数
int rowCount = VideoDao.countAllVideos();
//将Page类放入作用域,以便在jsp页面中显示
Page p1 = new Page(10, request.getParameter("num"), rowCount);
request.setAttribute("page", p1);
//将视频信息放入作用域,以便在页面中显示
List list = VideoDao.listAllVideos(p1.getStartRow(), p1.getSize());
request.setAttribute("vList", list);
%>
<jsp:include flush="true" page="head.jsp"></jsp:include>
<h1>将会列出所有的视频</h1>
<c:forEach items="$requestScope.vList" var="video">
<a href="display.jsp?vname=$video.vpath">$video.name</a><br>
视频标签:$video.label <br>
视频描述:$video.description <br>
点击量:$video.count <br>
作者:$video.userName <br>
上传时间:$video.createTime <br><br>
</c:forEach>
<div>
<jsp:include page="fenye.jsp">
<jsp:param name="url4page" value="videos.jsp" />
</jsp:include>
</div>
<jsp:include flush="true" page="foot.jsp"></jsp:include>
</body>
</html>
4. 数据库中查询数据:
public static List listAllVideos(int startRow,int size)
Connection conn=null;
PreparedStatement ps=null;
String sql = "select video.id,vpath,name,label,count,description,userName,video.createTime from video join user on user.id=video.userId order by createTime desc limit ?,? ";
ResultSet rs = null;
List list = new ArrayList();
try
conn= DBConn.getConnection();
ps = conn.prepareStatement(sql);
ps.setInt(1, startRow);
ps.setInt(2, size);
rs = ps.executeQuery();
while(rs.next())
com.puckasoft.video.vo.Video video = new com.puckasoft.video.vo.Video(rs.getInt("id"),rs.getString("vpath"),
rs.getString("name"),rs.getString("label"),rs.getString("description"),
rs.getString("userName"),rs.getInt("count"),rs.getTimestamp("createTime"));
list.add(video);
catch (SQLException e)
e.printStackTrace();
finally
DBConn.close(ps, conn);
return list;
public static int countAllVideos()
Connection conn=null;
PreparedStatement ps=null;
String sql = "select count(*) from video";
ResultSet rs = null;
int count=0;
try
conn= DBConn.getConnection();
ps = conn.prepareStatement(sql);
rs = ps.executeQuery();
while(rs.next())
count=rs.getInt(1);
catch (SQLException e)
e.printStackTrace();
finally
DBConn.close(ps, conn);
return count;
追问
这是Ajax实现的?开玩笑
追答尴尬,貌似贴错了。就当借鉴一下吧,我们学的是javascript、jsp和servlet。
本回答被提问者采纳知了堂学习笔记JSP页面数据分页实现——分页概念以及主流数据库的分页查询
一.分页简介
1.分页,就是一种将数据库里的数据一部分展示给用户的技术。为什么要这样做呢?因为一般来说用户在查询时数据是非常多的,当一个页面不能显示所有数据时,我们就要对查询的数据进行分页,就像我们的书本分成一页一页一样。最简单的例子就是百度,当你百度时,成千上万的数据,并不是呈现在一个页面的。
2.分页的实现方式
1)假分页(不推荐):什么是假分页呢?假分页就是一次性将数据库里的数据全部取出来,存储在页面中,然后再将数据分别展示出来。这种假分页在数据少的还可以玩玩,当数据多起来的时候,这种方式就爆炸了。由于一次取出的数据太大,会导致你的页面爆炸,点下一页要等很久,用户体验感很差,所以不推荐使用。
2)真正的分页:真正的分页就是你的页面需要多少数据,就去数据库取多少数据。这种分页就十分灵活了,在对付数据庞大的查询时,有很大的优势。所以我们这次的笔记就使用这样的方式。
二.数据库分页查询
数据库分页查询,就是根据页面的需要,一次只查询部分的数据,当用户点击下一页的时候就继续查询另外的数据。现在主流的数据库主要有三种:Oracle、MySQL、SQL server,我们接下来就看看,三种数据库对应分页查询的方法。
1.MySQL——相对来说最简单分页查询
MySQL的分页查询要用到 limit关键字,方式就是 limit m,n m表示第几条数据 n表示从m+1开始取多少条数据,比如
select * from table limit m,n 其中m是指记录开始的index,从0开始,表示第一条记录
具体:select * from tableName where 条件 limit 当前页码*页面容量-1,页面容量
2.Oracle 分页
Oracle分页要用到的关键字是 rownum (行号),我们直接看它的用法
1)查询表中的前n条记录 : select * from Table where rownum <= n
2)查询第 n 到第 m 条记录 :select * from (select 表名.*, rownum rn from 表名 where rownum <=m) where rn > n;
对于这种形式的查询,oracle不像mysql那么方便,它必须使用子查询或者是集合操作来实现。
3.SQL server的分页
在分页查询上,我感觉SQL Server比较费劲,没有一个专门的分页的语句,并且每个版本对应的查询方式不一样,比如:
1)SQL Server 2000数据库分页
Select top pagesize * from 表名 where 列名 not in(select top pagesize*page 列名 from 表名 order by 列名) order by 列名
2)SQL Server 2005数据库分页(后面的数据分页就大同小异了)
Select * from (select 列名,row_搜索number() over(order by 列名1) as 别名from 表名) as t where t.列名1>=startrow and t.列名1<=endrow
三.页面的编写
数据的分页查询学会了,我们就要规划页面如何在页面显示了。一般的网页中,我们都是以表格的样式呈现数据的,所以我们先把jsp页面做好,再去通过编写后台代码让数据呈现在页面上,这里我给出了我们测试的jsp页面:
效果图:
附上代码:
<div class="search"> <p>申请日期:</p> <select id="time"> <option >选择日期</option> </select> <input class="button" type="submit" name="" value="查询"></input> <div class="tuxin"><img src="../../images/图形化报表.png"> <a href="#">图形报表</a></div> <div class="dayin"><img src="../../images/打印机.png"> <a href="#">导出打印</a></div> <form> <p>采购编号:</p> <input type="text" name=""> <p>材料名称:</p> <input type="text" name=""> <input class="button" type="submit" name="" value="查询"></input> <input type="reset" class="button" value="重置" style="background:#e4e1e1;color:#000"></input> </form> </div> <div class="contents"> <table class="table"> <tr> <td>申请日期</td> <td>申请人</td> <td>采购员</td> <td>材料编号</td> <td>材料名称</td> <td>规格型号</td> <td>计量单位</td> <td>申请数量</td> <td>备注</td> <td>操作</td> </tr> <tr> <td>2017/8/7</td> <td>小贤</td> <td>张三</td> <td>1001</td> <td>玻璃</td> <td>100X100X3</td> <td>cm(厘米)</td> <td>1000</td> <td>无</td> <td><a class="delete" href="#"><img src="../../images/delete_8e.png"></a></td> </tr> </table> <div class="paging"> <a class="button" href="">上一页</a> <a href="#">1</a> <a href="#">2</a> <a href="#">3</a> <a href="#">4</a> <a href="#">5</a> <a class="button" href="">下一页</a> <p>共<span>5</span>页 到第</p> <input type="text" name=""> <p style="margin:2px -1px 0 10px;">页</p> <input class="button" type="submit" value="确认"> </div>
下章我们就实现JSP页面的分页:
以上是关于急求一个jsp+ajax实现分页的例子的主要内容,如果未能解决你的问题,请参考以下文章