ALL is Well!

敏捷是一条很长的路,摸索着前进着

  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  30 随笔 :: 23 文章 :: 71 评论 :: 0 Trackbacks
本文为原创,欢迎转载,转载请注明出处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}" />
    
&nbsp;&nbsp;共 ${totalPages} 页&nbsp;&nbsp;第 ${webPager.pageInfo.currentPage} 页&nbsp;&nbsp;转到
    
<input type="text" id='${id}_inputPageNo' name='${id}_inputPageNo' size="6"/>页 &nbsp;&nbsp;
    
<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包如图:

posted on 2010-12-01 17:35 李 明 阅读(5831) 评论(4)  编辑  收藏 所属分类: Struts2Freemarker

评论

# re: 基于Struts2、Freemarker的分页组件实现(附工程源码) 2011-04-10 07:20 wangflood
笔记嘛。  回复  更多评论
  

# re: 基于Struts2、Freemarker的分页组件实现(附工程源码)[未登录] 2011-06-06 11:52 cary
@wangflood
  回复  更多评论
  

# re: 基于Struts2、Freemarker的分页组件实现(附工程源码) 2012-07-31 08:16 Rach
包里是什么工程,怎么导不到myeclipse中  回复  更多评论
  

# re: 基于Struts2、Freemarker的分页组件实现(附工程源码) 2014-04-29 22:55 zuidaima
请参考代码:年末最代码部分源码大出血分享-freemarker,bootstrap,springdata jpa分页代码 ,下载地址:http://www.zuidaima.com/share/1606851189656576.htm
  回复  更多评论
  


只有注册用户登录后才能发表评论。


网站导航: