核心提示:除了jQuery外,需要导入3个js,script type=text/ src=js/doT.min.jsscriptscript type=text/ src=js/jquery.paginati...
除了jQuery外,需要导入3个js,
<script type="text/javascript" src="js/doT.min.js">script> <script type="text/javascript" src="js/jquery.pagination.js">script> <script type="text/javascript" src="js/my.page.js">script>
直接上my.page.js代码:
var Page = (function(obj) { var pageInfo={ pageSize:10, currentPage:1, totalPage:0, totalNumber:0 },param={},arry=[],url="",TPL="",el="",pageEl=""; obj.init = function(el,tplEl,pageEl,url){ this.TPL = doT.template(tplEl.text()); this.el = el; this.pageEl = pageEl; this.url = url; } obj.setQueryParam = function(param){ this.param = param; } obj.render = function(){ var _this = this; var data = { arry:_this.arry, pageInfo:_this.pageInfo } _this.el.empty().html(_this.TPL(data)); $("#resultNum").text(_this.pageInfo.totalNumber); if(_this.pageInfo.totalNumber!=0){ $("#page").pagination({ totalData: _this.pageInfo.totalNumber, showData: _this.pageInfo.pageSize, current:_this.pageInfo.currentPage, mode: 'fixed', callback: function (api) { _this.param['queryKey:pageIndex'] = api.getCurrent(); _this.getData(); } }); $("#page").append($('')) $("#pageSizeSelect").val(_this.pageInfo.pageSize); $("#page").show(); }else{ $("#page").hide(); } } obj.pageSizeChange = function(size){ this.param['queryKey:pageIndex'] = 1; this.param['queryKey:pageSize'] = size; this.getData(); } obj.getData = function(){ var _this = this; $.ajax({ type : "POST", dataType : "xml", data:_this.param, url :_this.url, success : function(data) { var errCode = _getXmlNodeValue(data,"context>error-code"); if( errCode != '000000' ){ var errDesc = _getXmlNodeValue(data,"context>error-desc"); alert( '处理错误[' + errCode + '] ==> ' + errDesc ); return; } var listStr = _getXmlNodeValue(data,"context>result>list"); var pageInfoStr = _getXmlNodeValue(data,"context>result>pageInfo"); _this.pageInfo = JSON.parse(pageInfoStr); _this.arry = JSON.parse(listStr); _this.render(); }, error : function(data) { alert(data); } }); } return obj; })(window.Page || {});
需要加上自己的默认分页查询:
/*配置分页*/ Page.init($("#resultContent"),$("#tpl"),$("#page"),"/action.ajax"); /*默认查询*/ var PARAM_FILTER = {}; PARAM_FILTER['queryKey:pageIndex'] = 1; PARAM_FILTER['queryKey:pageSize'] = 10; Page.setQueryParam(PARAM_FILTER); Page.getData();
加上Pagination:
public class Pagination { /** 每页显示条数 */ private Integer pageSize = 10; /** 当前页 */ private Integer currentPage = 1; /** 总页数 */ private Integer totalPage = 1; /** 查询到的总数据量 */ private Long totalNumber = 0L; public Pagination() { } public Pagination(Integer pageIndex,Integer pageSize,Long totalNumber) { this.pageSize = pageSize; this.currentPage = pageIndex; this.totalNumber = totalNumber; int pisor = (int) (this.totalNumber / this.pageSize); int remainder = (int) (this.totalNumber % this.pageSize); this.totalPage = remainder == 0 ? pisor == 0 ? 1 : pisor : pisor + 1; } public Integer getPageSize() { return pageSize; } public void setPageSize(Integer pageSize) { this.pageSize = pageSize; } public Integer getCurrentPage() { return currentPage; } public void setCurrentPage(Integer currentPage) { this.currentPage = currentPage; } public Integer getTotalPage() { return totalPage; } public void setTotalPage(Integer totalPage) { this.totalPage = totalPage; } public Long getTotalNumber() { return totalNumber; } public void setTotalNumber(Long totalNumber) { this.totalNumber = totalNumber; } }