本文為原創(chuàng),歡迎轉(zhuǎn)載,轉(zhuǎn)載請(qǐng)注明出處BlogJava。
本次分頁(yè)組件著重于頁(yè)面(Freemarker部分)、及Action部分。
至于Service及持久層處理,只是做了一個(gè)模擬的實(shí)現(xiàn),實(shí)際開發(fā)中,我是應(yīng)用了iBatis,封裝了分頁(yè)調(diào)用。
由于用法有所不同,所以就不放在源碼范圍內(nèi),也不在這里介紹了。
這里的分頁(yè)功能只提供了 上一頁(yè)、下一頁(yè)、指定頁(yè) 的分頁(yè),但在分頁(yè)Java代碼中包含了 首頁(yè)、末頁(yè)的實(shí)現(xiàn)。有需要的可自行添加。
分頁(yè)的效果如圖:
分頁(yè)實(shí)現(xiàn)代碼介紹:
1.pagination.ftl 分頁(yè)組件 頁(yè)面部分。
2.PageSupport.java 分頁(yè)Action部分。
3.WebPager.java 計(jì)算分頁(yè)動(dòng)作。
4.Pager.java 保存分頁(yè)信息,由Action傳遞到Service,根據(jù)Pager對(duì)象取得數(shù)據(jù)。
5.MockDataBase.java 模擬Dao,實(shí)現(xiàn)分頁(yè)處理。
使用該組件的方法如下:
第一步:引入分頁(yè)組件
<#include "/ftl/ecs/pagination.ftl" />
分頁(yè)組件使用了Freemarker的宏。
第二步:在ftl文件中使用分頁(yè)組件
分頁(yè)組件需要輸入4個(gè)參數(shù),分別為id、method、btnCssClass、cssClass,其中id、method必須輸入;btnCssClass、cssClass可選。以下是參數(shù)詳細(xì)說(shuō)明:
1.id : 分頁(yè)組件的唯一標(biāo)識(shí)。
2.method : 分頁(yè)用的Action。例如:定義了Action為Pagination,則method輸入 Pagination.action;若為動(dòng)態(tài)方法調(diào)用,可輸入Pagination!query.action
3.cssClass : 分頁(yè)組件的class屬性。例如cssClass="center"。
4.btnCssClass : 分頁(yè)組件按鈕的class屬性。例如btnCssClass="btn_history"。
<@pagination id="***" btnCssClass="***" cssClass="***" method="***.action">
<table>
<tr>
<td></td>
...
</tr>
</table>
</pagination>
[編輯]第三步:繼承分頁(yè)類PageSupport
PageSupport.java繼承自ActionSupport.java,在要分頁(yè)的方法中使用PageSupport.java提供的List pageCall(String module, String target, Map dataMap)分頁(yè)調(diào)用。
通過(guò)setPageSize(int pageSize)方法設(shè)定每頁(yè)顯示的記錄數(shù)。
API詳細(xì)說(shuō)明:
1.pageCall
參數(shù)說(shuō)明:
1) String module : 調(diào)用service的通道,例如:upf、esf。
2) String target : 要調(diào)用的service的方法,例如:com.ailk.ecs.service.TdupfPageService.selectAllUser。
3) Map dataMap : 輸入?yún)?shù)。
返回值說(shuō)明:
List : 頁(yè)面顯示的數(shù)據(jù)記錄。
2.setPageSize
參數(shù)說(shuō)明:
1) int pageSize : 每頁(yè)顯示記錄數(shù)。
[編輯]
第四步:Service代碼中使用
在service封裝分頁(yè)Dao或者分頁(yè)方法。
pagination.ftl代碼:
<#macro pagination id method cssClass="" btnCssClass="" pageSize='10'>
<div id='${id}'>
<#nested> <#-- 要刷新的區(qū)域 -->

<div class="${cssClass}">
<input type="button" onclick="Pagination${id}.gotoPage('prev', '${webPager.pageInfo.currentPage}', '${totalSize}');" value="上一頁(yè)" class="${btnCssClass}" />
共 ${totalPages} 頁(yè) 第 ${webPager.pageInfo.currentPage} 頁(yè) 轉(zhuǎn)到
<input type="text" id='${id}_inputPageNo' name='${id}_inputPageNo' size="6"/>頁(yè)
<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="下一頁(yè)" class="${btnCssClass}" />
</div>


<script>

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

this.Pagination$
{id} =
{}

// 分頁(yè)處理方法

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

// 當(dāng)總記錄數(shù)量小于等于每頁(yè)記錄數(shù)量時(shí),分頁(yè)動(dòng)作無(wú)效

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 提示錯(cuò)誤信息
return ;
}
}


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

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

{action : cmd,
totalSize : t,
currentPage : c
}
);
};
// 刷新當(dāng)前頁(yè)面

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

// 頁(yè)碼輸入框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>
請(qǐng)
點(diǎn)擊下載源碼。
非maven化工程,自己找包吧。
lib包如圖: