本文是struts2+jquery-ajax实现的在mySQL下的高效分页
1:先看下预览效果:(30多万数据测试)
2:这个实现首先把后台数据库返回的RowSet转化成json格式的字符串,再把这个json格式的字符串传给前台,用jquery解析
RowSet数据到json格式的数据转化函数如下:
/*
* @param count 数据总条目数
* @param pageCount 每页显示数据数
* */
private static String RowSetToJson(RowSet rt,int count,int pageCount){
ResultSetMetaData rm=null;
StringBuilder sb=new StringBuilder();
try {
rm=rt.getMetaData();
sb.append("{\"pageCount\":\""+count+"\",\"pageData\":[");
int columNum=rm.getColumnCount();
List<String> list=new ArrayList<String>();
for(int i=0;i<columNum;i++){
list.add(rm.getColumnName(i+1));
}
for(int i=0;i<pageCount&&rt.next();i++){
sb.append("{");
for(int j=0;j<list.size();j++){
if(j!=list.size()-1){
sb.append("\""+list.get(j)+"\":\""+rt.getString(list.get(j))+"\",");
}else{
sb.append("\""+list.get(j)+"\":\""+rt.getString(list.get(j))+"\"");
}
}
if(i!=pageCount-1){
sb.append("},");
}else{
sb.append("}");
}
}
sb.append("]}");
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return sb.toString();
}
调用转化函数方法:
public static String getJson(String tableName,String select,String where,String orderby,int pageIndex,int pageCount){
StringBuilder sb=new StringBuilder();
sb.append("select "+select+" from "+tableName);
if(!"".equals(where)){
sb.append(" ");
if(where.startsWith("where")){
sb.append(" "+where);
}else{
sb.append(" where "+where);
}
}
sb.append(" "+orderby+" ");
int temp=(pageIndex-1)*pageCount;
sb.append(" limit "+temp+","+pageCount);
RowSet rt=DBop.search(sb.toString());
//求数据总条目数
int rowNum=0;
rowNum=DBop.getNum(tableName,where);
return RowSetToJson(rt,rowNum,pageCount);
}
3:在action函数里调用方法:
import com.jiang.DB.GetData;
import com.opensymphony.xwork2.ActionSupport;
public class GetPageData extends ActionSupport {
private String p;//当前页
private String orderby;//排序规则
private String data;
public String getData() {
return data;
}
public void setData(String data) {
this.data = data;
}
public String getP() {
return p;
}
public void setP(String p) {
this.p = p;
}
public String getOrderby() {
return orderby;
}
public void setOrderby(String orderby) {
this.orderby = orderby;
}
public String execute()throws Exception{
if("".equals(orderby)){
orderby="order by id_t";
}
if("".equals(p)){
p=String.valueOf(1);
}
if(Integer.parseInt(p)==0){
p=String.valueOf(1);
}
data=GetData.getJson("pagetest", "*", "","order by id_t", Integer.parseInt(p), 10);
// System.out.println(data);
return SUCCESS;
}
}
]
4:页面ajax请求代码:
<%@ page language="java" import="java.util.*" pageEncoding="gbk"%>
<%
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%>">
<title>jquery-ajax分页</title>
<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">
<script src="js/jquery-1.2.6.pack.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.pagination.js" type="text/javascript"></script>
<link href="js/pagination.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var orderby="order by id_t";
$(document).ready(function(){
initData(0);
});
//翻页响应
function pageselectCallback(page_id,jq) {
initData(page_id);
}
function initData(pageindx)
{
var tbody="";
var pageCount="";
$.ajax({
type: "POST",//用POST方式传输
dataType:"json",//数据格式:JSON
url:'getData.action',//目标地址
async:false,//作用是防止在ajax成功调用之前就调用$("#Pagination").pagination,这个时候数据个数还没有初始化
data:"p="+(pageindx+1)+"&orderby="+escape(orderby),
beforeSend:function(){$("#divload").show();$("#Pagination").hide();},//发送数据之前
complete:function(){$("#divload").hide();$("#Pagination").show();},//接收数据完毕
success:function(json) {
$("#productTable tr:gt(0)").remove();
var productData = json.pageData;
pageCount=json.pageCount;
if(productData==""){
$("#divload").hide();
dis();
return false;
}
$.each(productData, function(i, n) {
var trs = "";
trs += "<tr><td align='center'>" + n.id_t + "</td><td align='center'>"+n.name_t+"</td><td align='center'>"+n.reamark_t+"</td><td align='center'>"+n.age_t+"</td><td align='center'>"+n.hobby_t+"</td><td align='center'><a href=\"javascript:edit('')\">编辑</a> <a href=\"javascript:view('')\">查看</a></td></tr>";
tbody+=trs;
});
$("#productTable").append(tbody);
//行交替颜色
$("#productTable tr:gt(0):odd").attr("class", "");
$("#productTable tr:gt(0):even").attr("class", "");
}//end of success
});
if(pageCount!=0){
$("#Pagination").pagination(pageCount, {
callback: pageselectCallback,
prev_text: '<< 上一页',
next_text: '下一页 >>',
items_per_page:10,
num_display_entries:6,
current_page:pageindx,
num_edge_entries:2
});
}
}
//排序
function Sort(ordercolumn,ordertipid){
var ordertype="";//1:desc,0:asc
var $orderimg = $("#"+ordertipid);
if($orderimg.html()!="")
{
var imgsrc="";
imgsrc = $("img",$orderimg).attr("src");
if(imgsrc.indexOf("asc")>-1){
$(".ordertip").empty();
$orderimg.html(" <img src=\"images/sort_desc.gif\" align=\"absmiddle\">");
ordertype = 1;
}
else
{
$(".ordertip").empty();
$orderimg.html(" <img src=\"images/sort_asc.gif\" align=\"absmiddle\">");
ordertype = 0;
}
}
else
{
$(".ordertip").empty();
$orderimg.html(" <img src=\"images/sort_desc.gif\" align=\"absmiddle\">");
ordertype = 1;
}
orderby = ordercolumn+"_"+ordertype;
initData(0);
}
</script>
</head>
<body>
<div id="divload" style="top:50%; right:50%;position:absolute; padding:0px; margin:0px; z-index:999"></div>
<table id="productTable" style="width:70%" class="TableList">
<tr class="TableHeader">
<th nowrap align="middle"><a style="cursor:pointer;" onclick="Sort('id_t','id_t');return false;">id</a><span id="id_t" class="ordertip"><img src="images/sort_desc.gif" align="absmiddle"></span></th>
<th nowrap align="middle"><a style="cursor:pointer;" onclick="Sort('name_t','name_t');return false;">name</a><span id="name_t" class="ordertip"><img src="images/sort_desc.gif" align="absmiddle"></span></th>
<th nowrap align="middle"><a style="cursor:pointer;" onclick="Sort('remark_t','remark_t');return false;">remark</a><span id="remark_t" class="ordertip"><img src="images/sort_desc.gif" align="absmiddle"></span></th>
<th nowrap align="middle"><a style="cursor:pointer;" onclick="Sort('age_t','age_t');return false;">age</a><span id="age_t" class="ordertip"><img src="images/sort_desc.gif" align="absmiddle"></span></th>
<th nowrap align="middle"><a style="cursor:pointer;" onclick="Sort('hobby_t','hobby_t');return false;">hobby</a><span id="hobby_t" class="ordertip"><img src="images/sort_desc.gif" align="absmiddle"></span></th>
<th nowrap align="middle"><a style="cursor:pointer;">操作</a><span id="Span8" class="ordertip"><img src="images/sort_desc.gif" align="absmiddle"></span></th>
</tr>
</table>
<div id="Pagination" class="flickr" style="text-align:left"></div>
</body>
</html>
5:struts.xml代码:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<constant name="struts.enable.DynamicMethodInvocation" value="false" />
<constant name="struts.devMode" value="true" />
<package name="default" namespace="/" extends="struts-default">
<default-action-ref name="index" />
<action name="getData" class="com.jiang.action.GetPageData">
<result name="success">/pageData.jsp</result>
</action>
</package>
</struts>
6:原代码下载:
分享到:
相关推荐
jQuery ajax 局部刷新分页。mysql数据库
使用myeclipse开发的jQuery加上struts的ajax无刷新分页,一个完整的demo,经测试,可运行。里面的数据是通过自己的拼凑的JSON数据来实现的分页。
struts2+ajax 发送jquery请求分页,返回josn对象,引用js自动解析,有jar包
网上找的一些资料: hibernate+spring的一个简单分页实现; 利用JQuery方便实现基于Ajax的数据查询、排序和分页功能; Hibernate+Struts分页代码
4.在服务端分页查询功能,优点:实时性:跳页才查询。数据量小:只加载当前页的记录进行显示。 5.单数据源配置(兼容Tomcat和Weblogic)。 6.Hibernate继承 HibernateDaoSupport。 7.Spring+Junit4单元测试,优点:...
先头上传的那个有点小问题~~ 修改了一下~~
struts2+ajax+easyui+json+datagrid增,删,改,查,分页,排序,有数据库
最近比较闲,想起来一直没时间做一个好点的分页效果。嗯马上做一个。分页都太熟悉了。以往用的分页都是比较常见的就是上一页,下一页,顶多再加个跳转到第几页。但是有没有好点的效果呢?因为现在一般都用strut2,...
在网上看到有很多人介绍了JQuery分页,但基本上都是一个静态的东西,对于新手来说根本就没有多大用处,如何与后台进行操作也...用到了JQuery 分页插件pagination, JQuery ajax 、JQuery json ,并集成了Struts框架。
用struts2框架写的增删查改完整例子,包括jquery,ajax等多种技术,分页以及批量修改,删除等功能,下拉列表使用数据库数据动态显示。数据库表已经一同上传,自己导入,修改下数据库名和密码。
使用jquery的ajax实现仿google人名自动补全;头像上传剪切压缩处理。 包含有完整的jar包和源代码,可以直接下载编译部署和运行,这是专门为我们实验室定制开发的。虽然后台逻辑并不复杂,但已经包含了架构基于s2sh...
用struts2框架写的增删查改完整例子,包括jquery,ajax,拦截器等多种技术,分页以及批量修改,删除等功能,下拉列表使用数据库数据动态显示。数据库表已经一同上传,自己导入,修改下数据库名和密码。
使用jquery的ajax实现仿google人名自动补全;头像上传剪切压缩处理。 包含有完整的jar包和源代码,这是专门为我们实验室定制开发的,包含了架构基于s2sh技术网站的参考实现(包括了全部基础部分:如分页,缓存,...
此项目是用于struts 与hibernate整合的,多对多表查询,里面技术使用了jquery中的ajax回显,使用了分页技术,并且自带了一个分页工具类,前后台交互采用json的形式来交互,实现了员工和部门表的增加 删除 修改 查询...
使用jquery的ajax实现仿google人名自动补全;头像上传剪切压缩处理。 包含有完整的jar包和源代码,可以直接下载编译部署和运行,这是专门为我们实验室定制开发的。虽然后台逻辑并不复杂,但已经包含了架构基于s2sh...
SSH(Spring+Struts+Hibernate)轻量级论坛Forum演示系统(Java Web Edition): Spring+Struts+Hibernate框架、Pagination分页组件、JQuery、JSON、Ajax、DIV+CSS、JavaScript、HTML5。另建议使用相当于IE8.0以上的...
技术实现:Struts2、JSP、MySQL、Jquery、Javascript、Ajax 、Json、JUnit 项目描述: 本项目主要实现了用户管理模块、商品分类展示模块、购物车模块、订单模块。 用户管理模块实现了用户注册、实时验证、用户登录...
此程序是我自己开发的,里面涉及到文件上传、分页、fckeditor编辑器、acegi权限、ajax、jQuery使用、JSTL标签等等在实际项目开发中会遇到的种种问题。对于学习ssh框架的朋友来说,这个项目的代码是很有帮助的。
系统开发环境: MyEclipse8.5以上版本 + mysql 后台采用技术: struts 2 + Spring + Hibernate (SSH2) 前台技术: jquery + easyui框架 所有的数据提交和查询都是通过ajax方式异步传输! 图书数据的添加和查询都是在...
系统开发环境: MyEclipse8.5以上版本 + mysql 后台采用技术: struts 2 + Spring + Hibernate (SSH2) 前台技术: jquery + easyui框架 所有的数据提交和查询都是通过ajax方式异步传输! 图书数据的添加和查询都是...