实用的java分页ajax分页和普通分页

来源：互联网发布：linux安装出现dracut 编辑：程序博客网时间：2024/05/25 08:12

下面给一个我项目中用用到的分页技术，不是很完美（个人觉得用分页标签不错），这个里面有ajax分页查询和普通的分页查询,我的项目是采用struts2 + spring+mybatis。

首先看一下分页的实体类

/**

* 分页

* @author Administrator

public class PageUtil {

/** 设置当前页码 */

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> ");

} else {

str.append("首页 ");

}

if (curPage > 1) {

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

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

} else {

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

}

if (curPage < totalPage) {

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

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

} else {

str.append("下页 ");

}

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

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

+ totalPage

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

} else {

str.append("末页  ");

}

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> ");

} else {

str.append("首页 ");

}

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> ");

} else {

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

}

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> ");

} else {

str.append("下页 ");

}

if (totalPage > 1 && 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>  ");

} else {

str.append("末页  ");

}

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 + "]";

}

2.在看一下后台java怎样调用这个实体

private DataEntity dataEntity;

private List<DataEntity> dataList;

private DataAffair dataAffair;

private PageUtil page;

private Integer year;

public String selectByPage() {

int count = dataAffair.allDataCount();//到业务层获取总条数

page.setPagesVariable(count);

String pageBar = page.getAJAXToolsMenu();

request.put("pageBar", pageBar);

Map<String, Integer> pageMap = new HashMap<String, Integer>();

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

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

dataList = dataAffair.selectDataByPageInfoWeb(pageMap);//去业务层获取数据

return success;

}

3.在看一下前段怎么调用分页(jquery)

var curPage = 1, pageSize = 10;

$(function() {

dataInfoList();

});

function dataInfoList() {

submitData = "page.curPage=" + curPage + "&page.pageSize=" + pageSize + "&year=" + year;

$.ajax({ //一个Ajax过程

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

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

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

data : submitData,

beforeSend: function(XMLHttpRequest){

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

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

success : function(data) {//如果调用成功

$("#site_list").html(data);

$(".showControlPage").append("<input name=\"year\" type=\"hidden\" />");

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

error:function(){

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

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

}

})//发给数据

}

function showPages(curPageUser, pageSizeUser) {

curPage = curPageUser;

pageSize = pageSizeUser;

dataInfoList();

}

</script>

最终效果图

由于本人权限不够不能上图

结束语：

这只是我个人思路写出来的分页代码，网各位网友补充不足之处，还有普通的分页实现直接调用即可，这里不再阐述。