`
jiava9900
  • 浏览: 86711 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

java简单的通用ajax分页方法

阅读更多

    发表一个自己常用的分页的通用代码,实现了ajax分页。此例子是在Struts2+Hibernate+Spring框架下实现的,分页工具类是通用的,只不过查询、控制是根据使用的方法的不同而不同。

?

PaginationUtil.java




package com.dsh.pagination.tool;
/**
 * ajax分页
 * @author: DuanLang
 * @company:oddTech
 * @time:2011-12-2 上午11:10:36
 */
public class PaginationUtil {
	/** 设置当前页码 */

	private int curPage = 1;

	/** 设置每一页的行数 */

	private int pageSize = 15;

	/** 从数据库读取的开始记录数 */

	private int start;

	/** 从数据库读取的行数(每一页显示的记录数) */

	private int pageCount;

	/** 总共行数(记录数) */

	private int totalRow;

	/** 总共页数 */

	private int totalPage;

	/** 分页导航条 */

	private String pageBar;

	/**
	 * 
	 * 根据从数据库读出的总记录数初始化相应的分页变量
	 * 
	 * @param totalRow
	 *            总记录数
	 */

	public void setPagesVariable(int totalRow) {

		this.setTotalRow(totalRow);

		this.setTotalPage(totalRow / pageSize);

		if (totalRow % pageSize > 0) {

			this.setTotalPage(totalPage + 1);

		}

		if (curPage > 1) {

			this.setStart((curPage - 1) * pageSize);

		} else {

			this.setStart(0);

		}

		this.setPageCount(pageSize);

	}

	/**
	 * 
	 * @return the curPage
	 */

	public int getCurPage() {

		return curPage;

	}

	/**
	 * 
	 * @param curPage
	 * 
	 *            the curPage to set
	 */

	public void setCurPage(int curPage) {

		this.curPage = curPage;

	}

	/**
	 * 
	 * @return the pageSize
	 */

	public int getPageSize() {

		return pageSize;

	}

	/**
	 * 
	 * @param pageSize
	 * 
	 *            the pageSize to set
	 */

	public void setPageSize(int pageSize) {

		this.pageSize = pageSize;

	}

	/**
	 * 
	 * @return the start
	 */

	public int getStart() {

		return start;

	}

	/**
	 * 
	 * @param start
	 * 
	 *            the start to set
	 */

	public void setStart(int start) {

		this.start = start;

	}

	/**
	 * 
	 * @return the pageCount
	 */

	public int getPageCount() {

		return pageCount;

	}

	/**
	 * 
	 * @param pageCount
	 *            the pageCount to set
	 */

	public void setPageCount(int pageCount) {

		this.pageCount = pageCount;

	}

	/**
	 * 
	 * @return the totalRow
	 */

	public int getTotalRow() {

		return totalRow;

	}

	/**
	 * 
	 * @param totalRow
	 * 
	 *            the totalRow to set
	 */

	public void setTotalRow(int totalRow) {

		this.totalRow = totalRow;

	}

	/**
	 * 
	 * @return the totalPage
	 */

	public int getTotalPage() {

		return totalPage;

	}

	/**
	 * 
	 * @param totalPage
	 * 
	 *            the totalPage to set
	 */

	public void setTotalPage(int totalPage) {

		this.totalPage = totalPage;

	}

	/**
	 * 
	 * @return the pageBar
	 */

	public String getPageBar() {

		return pageBar;

	}

	/**
	 * 
	 * @param pageBar
	 * 
	 *            the pageBar to set
	 */

	public void setPageBar(String pageBar) {

		this.pageBar = pageBar;

	}

	/**
	 * 
	 * 分页导航条(显示分页链接控制代码)
	 * 
	 * @return
	 */

	public String getToolsMenu() {

		StringBuffer str = new StringBuffer("");

		int next, prev;

		prev = curPage - 1;

		next = curPage + 1;

		if (curPage > 1) {

			str.append("<a href=\"#\" onclick=\"this.parentNode.getElementsByTagName('input')[0].value=1;this.parentNode.submit();\">首页</a>&amp;nbsp;");

		} else {

			str.append("首页&amp;nbsp;");

		}

		if (curPage > 1) {

			str.append("<a href=\"#\" onclick=\"this.parentNode.getElementsByTagName('input')[0].value="

					+ prev + ";this.parentNode.submit();\">上页</a>&amp;nbsp;");

		} else {

			str.append("上页</a>&amp;nbsp;");

		}

		if (curPage < totalPage) {

			str.append("<a href=\"#\" onclick=\"this.parentNode.getElementsByTagName('input')[0].value="

					+ next + ";this.parentNode.submit();\">下页</a>&amp;nbsp;");

		} else {

			str.append("下页&amp;nbsp;");

		}

		if (totalPage > 1 &amp;&amp; curPage != totalPage) {

			str.append("<a href=\"#\"  onclick=\"this.parentNode.getElementsByTagName('input')[0].value="

					+ totalPage

					+ ";this.parentNode.submit();\">末页</a>&amp;nbsp;&amp;nbsp;");

		} else {

			str.append("末页&amp;nbsp;&amp;nbsp;");

		}

		str.append(" 共" + totalRow + "条记录");

		str.append("  每页<SELECT size=\"1\" name=\"page.pageSize\" onchange=\"this.form.getElementsByTagName('input')[0].value=1;this.form.submit();\">");

		if (pageSize == 2) {

			str.append("<OPTION value=2 selected>2</OPTION>");

		} else {

			str.append("<OPTION value=2>2</OPTION>");

		}

		if (pageSize == 5) {

			str.append("<OPTION value=5 selected>5</OPTION>");

		} else {

			str.append("<OPTION value=5>5</OPTION>");

		}

		if (pageSize == 10) {

			str.append("<OPTION value=10 selected>10</OPTION>");

		} else {

			str.append("<OPTION value=10>10</OPTION>");

		}

		if (pageSize == 15) {

			str.append("<OPTION value=15 selected>15</OPTION>");

		} else {

			str.append("<OPTION value=15>15</OPTION>");

		}

		if (pageSize == 20) {

			str.append("<OPTION value=20 selected>20</OPTION>");

		} else {

			str.append("<OPTION value=20>20</OPTION>");

		}

		if (pageSize == 50) {

			str.append("<OPTION value=50 selected>50</OPTION>");

		} else {

			str.append("<OPTION value=50>50</OPTION>");

		}

		if (pageSize == 100) {

			str.append("<OPTION value=100 selected>100</OPTION>");

		} else {

			str.append("<OPTION value=100>100</OPTION>");

		}

		str.append("</SELECT>");

		str.append("条 分" + totalPage + "页显示 转到");

		str.append("<SELECT size=\"1\" name=\"Pagelist\" onchange=\"this.form.getElementsByTagName('input')[0].value=this.value;this.form.submit();\">");

		for (int i = 1; i < totalPage + 1; i++) {

			if (i == curPage) {

				str.append("<OPTION value=" + i + " selected>" + i

				+ "</OPTION>");

			} else {

				str.append("<OPTION value=" + i + ">" + i + "</OPTION>");

			}

		}

		str.append("</SELECT>页");

		str.append("<INPUT type=\"hidden\"  value=" + curPage

		+ " name=\"page.curPage\" > ");

		return str.toString();

	}

	/**
	 * 
	 * AJAX分页导航条(显示分页链接控制代码)
	 * 
	 * @return
	 */

	public String getAJAXToolsMenu() {

		StringBuffer str = new StringBuffer("");

		int next, prev;

		prev = curPage - 1;

		next = curPage + 1;

		str.append("<span class=\"showControlPage\">");

		if (curPage > 1) {

			str.append("<a href=\"javascript:\" onclick=\"this.parentNode.getElementsByTagName('input')[0].value=1;showPages(this.parentNode.getElementsByTagName('input')[0].value,this.parentNode.getElementsByTagName('select')[0].value);\">首页</a>&amp;nbsp;");

		} else {

			str.append("首页&amp;nbsp;");

		}

		if (curPage > 1) {

			str.append("<a href=\"javascript:\" onclick=\"this.parentNode.getElementsByTagName('input')[0].value="

					+ prev
					+ ";showPages(this.parentNode.getElementsByTagName('input')[0].value,this.parentNode.getElementsByTagName('select')[0].value);\">上页</a>&amp;nbsp;");

		} else {

			str.append("上页</a>&amp;nbsp;");

		}

		if (curPage < totalPage) {

			str.append("<a href=\"javascript:\" onclick=\"this.parentNode.getElementsByTagName('input')[0].value="

					+ next
					+ ";showPages(this.parentNode.getElementsByTagName('input')[0].value,this.parentNode.getElementsByTagName('select')[0].value);\">下页</a>&amp;nbsp;");

		} else {

			str.append("下页&amp;nbsp;");

		}

		if (totalPage > 1 &amp;&amp; curPage != totalPage) {

			str.append("<a href=\"javascript:\"  onclick=\"this.parentNode.getElementsByTagName('input')[0].value="

					+ totalPage

					+ ";showPages(this.parentNode.getElementsByTagName('input')[0].value,this.parentNode.getElementsByTagName('select')[0].value);\">末页</a>&amp;nbsp;&amp;nbsp;");

		} else {

			str.append("末页&amp;nbsp;&amp;nbsp;");

		}

		str.append(" 共" + totalRow + "条记录");

		str.append("  每页<SELECT size=\"1\" name=\"page.pageSize\" onchange=\"this.parentNode.getElementsByTagName('input')[0].value=1;showPages(1,this.value);\">");

		if (pageSize == 2) {

			str.append("<OPTION value=2 selected>2</OPTION>");

		} else {

			str.append("<OPTION value=2>2</OPTION>");

		}

		if (pageSize == 5) {

			str.append("<OPTION value=5 selected>5</OPTION>");

		} else {

			str.append("<OPTION value=5>5</OPTION>");

		}

		if (pageSize == 10) {

			str.append("<OPTION value=10 selected>10</OPTION>");

		} else {

			str.append("<OPTION value=10>10</OPTION>");

		}

		if (pageSize == 15) {

			str.append("<OPTION value=15 selected>15</OPTION>");

		} else {

			str.append("<OPTION value=15>15</OPTION>");

		}

		if (pageSize == 20) {

			str.append("<OPTION value=20 selected>20</OPTION>");

		} else {

			str.append("<OPTION value=20>20</OPTION>");

		}

		if (pageSize == 50) {

			str.append("<OPTION value=50 selected>50</OPTION>");

		} else {

			str.append("<OPTION value=50>50</OPTION>");

		}

		if (pageSize == 100) {

			str.append("<OPTION value=100 selected>100</OPTION>");

		} else {

			str.append("<OPTION value=100>100</OPTION>");

		}

		str.append("</SELECT>");

		str.append("条 分" + totalPage + "页显示 转到");

		str.append("<SELECT size=\"1\" name=\"Pagelist\" onchange=\"this.parentNode.getElementsByTagName('input')[0].value=this.value;showPages(this.value,this.parentNode.getElementsByTagName('select')[0].value);\">");

		for (int i = 1; i < totalPage + 1; i++) {

			if (i == curPage) {

				str.append("<OPTION value=" + i + " selected>" + i

				+ "</OPTION>");

			} else {

				str.append("<OPTION value=" + i + ">" + i + "</OPTION>");

			}

		}

		str.append("</SELECT>页");

		str.append("<INPUT type=\"hidden\"  value=" + curPage

		+ " name=\"page.curPage\" > ");

		str.append("</span>");

		return str.toString();

	}

	/*
	 * (non-Javadoc)
	 * 
	 * @see java.lang.Object#toString()
	 */

	@Override
	public String toString() {

		return "PageUtil [curPage=" + curPage + ", pageSize=" + pageSize

		+ ", start=" + start + ", pageCount=" + pageCount

		+ ", totalRow=" + totalRow + ", totalPage=" + totalPage + "]";

	}

}


?这个是实现根据分页的信息(查询起始标号、要查询的记录的条数)来从数据库中读取信息。

UserDaoImpl.java




package com.dsh.pagination.dao.impl;

import java.util.List;
import java.util.Map;

import org.hibernate.Query;
import org.springframework.orm.hibernate3.support.HibernateDaoSupport;

import com.dsh.pagination.dao.UserDao;

public class UserDaoImpl extends HibernateDaoSupport implements UserDao {

	@Override
	public List getUserByPageInfo(Map<String, Integer> pageMap) {
		Query query=this.getSession().createQuery("from User");
		query.setFirstResult(pageMap.get("start"));//设置数据查询的开始位置
		query.setMaxResults(pageMap.get("pageCount")); //设置查询的条数
		return query.list();
	}
	
	@Override
	public int getAllUserNum() {
		Query query=this.getSession().createQuery("select count(u.id) as number from User u");
		int num=((Number)query.iterate().next()).intValue();
		return num;
	}

}


?Service层就不贴出来了,基本上和Dao层差不多。下面贴出控制层代码,负责从前台获取分页的信息,和向前台发送从数据库中查询出的信息,传送是以json格式进行的。

?

UserActionImpl.java




package com.dsh.pagination.action.impl;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.apache.struts2.json.annotations.JSON;

import com.dsh.pagination.action.UserAction;
import com.dsh.pagination.model.User;
import com.dsh.pagination.service.UserService;
import com.dsh.pagination.tool.JsonUtil;
import com.dsh.pagination.tool.PaginationUtil;
import com.opensymphony.xwork2.ActionSupport;

public class UserActionImpl extends ActionSupport implements UserAction {
	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;
	private UserService us;
	private List<User> list;
	private PaginationUtil pageUtil;
	private String pageBar;
	private String users;

	@Override
	public String getUserByPageInfo() {
		System.out.println(pageUtil.getPageSize()+"从前台获取的数据");
		int num = this.us.getUserNum();
		System.out.println(num+"这是数据库中用户的个数");
		pageUtil.setPagesVariable(num);
		this.pageBar = pageUtil.getAJAXToolsMenu();
		Map<String, Integer> pageInfo = new HashMap<String, Integer>();

		pageInfo.put("start", pageUtil.getStart());// 设置数据查询的开始位置

		pageInfo.put("pageCount", pageUtil.getPageCount());// 设置查询的数据条数

		list = us.getUserByPageInfo(pageInfo);// 去业务层获取数据
		if (list.size() > 0) {
			this.users=JsonUtil.listToJson(list);
			return SUCCESS;
		}
		return ERROR;
	}
	@JSON(serialize=false)
	public UserService getUs() {
		return us;
	}

	public void setUs(UserService us) {
		this.us = us;
	}
	@JSON(serialize=false)
	public List<User> getList() {
		return list;
	}

	public void setList(List<User> list) {
		this.list = list;
	}
	@JSON(serialize=false)
	public PaginationUtil getPageUtil() {
		return pageUtil;
	}

	public void setPageUtil(PaginationUtil pageUtil) {
		this.pageUtil = pageUtil;
	}
	@JSON(name="pageBar")
	public String getPageBar() {
		return pageBar;
	}

	public void setPageBar(String pageBar) {
		this.pageBar = pageBar;
	}
	@JSON(name="users")
	public String getUsers() {
		return users;
	}
	public void setUsers(String users) {
		this.users = users;
	}

}


?在前台我们就可以通过如下的方式进行调用了




<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>java通用分页显示数据</title>
<script type="text/javascript" src="jquery.js"></script>
<script language="javascript" type="text/javascript">
	var curPage = 1, pageSize = 10;
	$(function() {

		dataInfoList();

	});

	function dataInfoList() {

		submitData = "pageUtil.curPage=" + curPage + "&amp;pageUtil.pageSize=" + pageSize;
		$.ajax({ //一个Ajax过程 

					type : "post", //以post方式与后台沟通

					url : "getUserByPageInfoAction.action", //与此页面沟通

					dataType : "json",//返回的值以 html方式 解释

					data :submitData,

					beforeSend : function(XMLHttpRequest) {

						$("#loadingMessage")
								.html(
										"&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;<img src=\"/html/images/loading.gif\"><span>请稍后,数据加载中!</span>");

						$("#loadingMessage").css({
							display : ""
						});

					},

					success : function(data) {//如果调用成功
					
						var users=eval('('+data.users+')');
						alert(users[0].id);
						/* for(i in users){
							$("#site_list").html(user[i].id);
						} */
						
						$("#loadingMessage").css({
							display : "none"
						});
						$("#pageBar").html(data.pageBar);
					},
					error : function() {
						$("#loadingMessage").css({
							display : ""
						});

						$("#loadingMessage")
								.html(
										"<span class=\"errorFont\">数据加载遇到错误,请稍后再试</span>");

					}

				});

	}

	function showPages(curPageUser, pageSizeUser) {

		curPage = curPageUser;

		pageSize = pageSizeUser;

		dataInfoList();

	}
</script>
</head>
<body>
<div id="site_list">

</div>
<div class="showControlPage"></div>
<div id="loadingMessage"></div>
<div id="pageBar"></div>

</body>
</html>


?简单的效果如下所示,我的数据库中并没用任何数据,所以效果只能显示成这样了。

?

?

<span style="font-family: Simsun; font-size: medium;">首页?上页?下页?末页?? 共20条记录 每页<select name="page.pageSize" size="1"><option value="2">2</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="50">50</option>
<option value="100">100</option></select>条 分2页显示 转到<select name="Pagelist" size="1"><option value="1">1</option>
<option value="2">2</option></select>页</span>

?

 
0
0
分享到:
评论
1 楼 ken890202 2014-03-13  
   

相关推荐

    java 通用数字分页

    Java中的数字分页是Web应用开发中常见的需求,特别是在大数据量的展示场景下,为了提高用户体验,需要将数据分批次加载。Struts2框架作为Java Web开发中的热门选择,提供了强大的分页支持。本主题主要讲解如何在...

    java web项目分页通用实现

    总结,Java Web项目中的分页通用实现涉及到数据库查询、参数传递、前后端交互等多个环节。通过封装分页组件,我们可以将这些复杂逻辑模块化,便于在不同的项目中复用,从而提升开发质量和效率。这个DEMO正是为了帮助...

    java 通用分页示例

    在Java开发中,分页是常见的功能,尤其是在处理大量数据时,为了提高用户体验,需要将数据分批展示。本示例结合Struts和Hibernate框架,通过自定义标签实现了通用的分页功能。以下是对这个主题的详细解释: 一、...

    Ajax通用分页源码(ASP.net)

    13. **AjaxPaginCls.csproj**:这是Visual Studio的项目文件,包含了项目的所有引用、文件和编译设置,用于构建和管理这个Ajax分页组件。 通过这个源码,开发者可以学习如何在ASP.NET环境中利用Ajax实现高效、流畅...

    ajax分页_ajax分页_

    **四、通用Ajax分页组件** 为了提高代码复用性,开发者通常会封装一个通用的Ajax分页组件,该组件接受一些配置参数,如URL、每页大小、回调函数等,然后自动处理请求和数据更新。这样,只需要在不同页面调用这个...

    PageHelper AJAX MVC 分页封装(初体验)

    在实现AJAX分页时,前端通常会使用jQuery或其他JavaScript库发送异步请求。当用户点击页码或更改每页显示数量时,AJAX会向服务器发送请求,而不是刷新整个页面,这样能保持用户的浏览状态,并提供流畅的交互体验。...

    前台Java通用分页详解描述下

    本篇将详细介绍Java中实现前端通用分页的方法和注意事项。 首先,我们需要理解分页的基本概念。分页通常包括两部分:页码和每页显示的数据数量。用户通过选择页码或调整每页显示数量来查看数据的不同部分。在Java中...

    通用分页js

    本文介绍了“通用分页JS”在JSP环境下的使用方法及其核心功能。通过分析代码逻辑,我们可以看到这是一个简单实用的分页解决方案。对于希望快速实现分页功能的开发者来说,该脚本提供了很好的参考价值。同时,我们还...

    java(jsp) 分页

    - 开发者可以根据具体需求自定义分页组件,封装通用的分页逻辑,提高代码复用性。这些组件通常包括计算页码、处理查询参数、构建分页链接等功能。 分页设计时需要考虑的关键点包括: - 性能优化:避免全表扫描,...

    自定义通用分页一行代码解决分页问题

    本主题围绕“自定义通用分页一行代码解决分页问题”展开,介绍如何通过提供的BaseDao、PageBean分页工具类以及PageBeanTag助手类实现高效且简洁的分页功能。 首先,`BaseDao`是数据库操作的基类,通常包含了基本的...

    通用分页组件JPage

    JPage是一款通用的分页组件,旨在简化Java Web开发中的分页实现,提供了灵活的配置和丰富的功能。下面我们将详细探讨JPage的原理、使用方法以及其在实际项目中的应用。 ### 1. JPage概述 JPage是一款开源的Java...

    java分页空间

    Java分页技术是Java开发中常见的一种...以上是对Java分页空间的全面解析,涵盖了后端查询、前端展示、配置文件、资源管理和通用设计等多个方面。对于实际开发,理解这些知识点有助于构建高效且用户体验良好的分页系统。

    很好的通用分页

    "很好的通用分页"是指一个高效且可复用的分页解决方案,它允许开发者轻松地在自己的应用中实现分页功能,只需要简单的复制和粘贴代码,大大提高了开发效率。 PageBean是Java Web开发中用于处理分页数据的一个对象,...

    用于通用分页之jsp进阶

    当我们谈论“用于通用分页之jsp进阶”时,这意味着我们将探讨如何在JSP中实现高效且可复用的分页功能,这对于大型数据集的展示至关重要。 分页是Web应用中常见的一种用户体验优化,它允许用户逐步浏览大量的信息,...

    通用查询框架(hibernate+Ajax+jstl)

    基于hibernate的开源通用查询框架: 1.支持全部hql语法 2.可以支持Ajax用的 xml数据结构,也可以支持jsp、jstl、struts等标签,根据配置不同的数据解析器,得到不同结构的数据。 3.集成完整的分页功能。 4....

    SSH分页源代码

    同时,确保分页代码的可重用性,可以通过创建通用的分页工具类或组件,让不同的数据查询都可以轻松实现分页。 总的来说,这个"SSH分页源代码"实例是一个学习如何在Java Web环境中整合SSH框架,并利用它们处理分页...

    extjs+java+mysql通用后台管理

    在“extjs-java-mysql通用后台”这个项目中,开发者通常会定义一系列RESTful API接口,这些接口由Java Spring处理,EXTJS前端通过AJAX调用这些接口,实现数据的增删改查和页面的动态更新。同时,为了保证系统的安全...

    jsp 分页示例源码

    在实际应用中,为了优化性能,我们还可以考虑缓存技术、存储过程、分页组件(如PageHelper)的使用,以及在前端使用Ajax实现无刷新分页等方法。这些都是在学习JSP分页过程中值得深入研究的领域。 总之,JSP分页是...

    ssh实现分页

    5. 在用户滚动到底部时,可以采用无限滚动(Ajax分页)的方式加载更多数据。 综上所述,SSH框架下的分页实现涉及Struts2、Spring和Hibernate等多个层面,通过合理设计和优化,可以提供高效且友好的分页功能。开发者...

    java web项目中如何使用分页从action到jsp页面的实现

    5. **分页组件**:在实际项目中,为了提高代码复用性,我们可以创建一个通用的分页组件。这个组件可以包含分页计算逻辑、生成分页HTML等,这样在多个地方需要分页功能时,只需要调用这个组件即可。 通过以上步骤,...

Global site tag (gtag.js) - Google Analytics