本文为原创,欢迎转载,转载请注明出处BlogJava。
本次分页组件着重于页面(Freemarker部分)、及Action部分。
至于Service及持久层处理,只是做了一个模拟的实现,实际开发中,我是应用了iBatis,封装了分页调用。
由于用法有所不同,所以就不放在源码范围内,也不在这里介绍了。
这里的分页功能只提供了 上一页、下一页、指定页 的分页,但在分页Java代码中包含了 首页、末页的实现。有需要的可自行添加。
分页的效果如图:
分页实现代码介绍:
1.pagination.ftl 分页组件 页面部分。
2.PageSupport.java 分页Action部分。
3.WebPager.java 计算分页动作。
4.Pager.java 保存分页信息,由Action传递到Service,根据Pager对象取得数据。
5.MockDataBase.java 模拟Dao,实现分页处理。
使用该组件的方法如下:
第一步:引入分页组件
<#include "/ftl/ecs/pagination.ftl" />
分页组件使用了Freemarker的宏。
第二步:在ftl文件中使用分页组件
分页组件需要输入4个参数,分别为id、method、btnCssClass、cssClass,其中id、method必须输入;btnCssClass、cssClass可选。以下是参数详细说明:
1.id : 分页组件的唯一标识。
2.method : 分页用的Action。例如:定义了Action为Pagination,则method输入 Pagination.action;若为动态方法调用,可输入Pagination!query.action
3.cssClass : 分页组件的class属性。例如cssClass="center"。
4.btnCssClass : 分页组件按钮的class属性。例如btnCssClass="btn_history"。
<@pagination id="***" btnCssClass="***" cssClass="***" method="***.action">
<table>
<tr>
<td></td>
...
</tr>
</table>
</pagination>
[编辑]第三步:继承分页类PageSupport
PageSupport.java继承自ActionSupport.java,在要分页的方法中使用PageSupport.java提供的List pageCall(String module, String target, Map dataMap)分页调用。
通过setPageSize(int pageSize)方法设定每页显示的记录数。
API详细说明:
1.pageCall
参数说明:
1) String module : 调用service的通道,例如:upf、esf。
2) String target : 要调用的service的方法,例如:com.ailk.ecs.service.TdupfPageService.selectAllUser。
3) Map dataMap : 输入参数。
返回值说明:
List : 页面显示的数据记录。
2.setPageSize
参数说明:
1) int pageSize : 每页显示记录数。
[编辑]
第四步:Service代码中使用
在service封装分页Dao或者分页方法。
pagination.ftl代码:
<#macro pagination id method cssClass="" btnCssClass="" pageSize='10'>
<div id='${id}'>
<#nested> <#-- 要刷新的区域 -->

<div class="${cssClass}">
<input type="button" onclick="Pagination${id}.gotoPage('prev', '${webPager.pageInfo.currentPage}', '${totalSize}');" value="上一页" class="${btnCssClass}" />
共 ${totalPages} 页 第 ${webPager.pageInfo.currentPage} 页 转到
<input type="text" id='${id}_inputPageNo' name='${id}_inputPageNo' size="6"/>页
<input type="text" style="display:none"/>
<input type="button" onclick="Pagination${id}.gotoPage('input', '${webPager.pageInfo.currentPage}', '${totalSize}');" value="确定" class="${btnCssClass}" />
<input type="button" onclick="Pagination${id}.gotoPage('next', '${webPager.pageInfo.currentPage}', '${totalSize}');" value="下一页" class="${btnCssClass}" />
</div>


<script>

if (!this.Pagination$
{id} )
{

this.Pagination$
{id} =
{}

// 分页处理方法

Pagination$
{id}.gotoPage = function(action, c, t)
{
var cmd = action;

// 当总记录数量小于等于每页记录数量时,分页动作无效

if (t <= $
{webPager.pageInfo.pageSize})
{
return;
}

// 确定按钮处理

if(action == 'input')
{
var inValue = $("#${id}_inputPageNo").val();


if(inValue.match(/^[0-9]+$/) && parseInt(inValue) > 0)
{
cmd = inValue;
}

else
{
// TODO 提示错误信息
return ;
}
}


$('#$
{id}').load(

'$
{method} #$
{id}',

{action : cmd,
totalSize : t,
currentPage : c
}
);
};
// 刷新当前页面

Pagination$
{id}.refreshPage = function()
{
//Pagination${id}.gotoPage('refresh');
//scrollPage${id}('refresh', "${method}");
};

// 页码输入框keyup事件
//Pagination${id}.keyup = function(inputElem, currentPage, totalSize) {
//if (inputElem.value.match(/^[0-9]+$/) && parseInt(inputElem.value) > 0) {
//Pagination${id}.gotoPage(inputElem.value, currentPage, totalSize);
//}
//};
//$("#${id}_inputPageNo").keyup(function(event){
//if(event.keyCode == 13) {
//Pagination${id}.keyup(this, '${webPager.pageInfo.currentPage}', '${totalSize}');
//}
//});
}
</script>

</div>
</#macro>
请
点击下载源码。
非maven化工程,自己找包吧。
lib包如图: