模板分页封装

最新推荐文章于 2022-12-07 14:52:45 发布

xiaomin_____

最新推荐文章于 2022-12-07 14:52:45 发布

阅读量234

点赞数

本文链接：https://blog.csdn.net/xiaomin1991222/article/details/50980229

版权

var ajaxCommFunPage = function(url, data, callback) {
	jQuery.ajax({
		type : "post",
		async: false,
		//dataType:'html',
		url : url,
		timeout: 30000,
		data : data,
		success : callback
	});
};

var asyncSubmit = function(formId){
	var formObj = $('#'+formId);
	var asyncFlag = formObj.find("input[name='asyncFlag']").val();
	var prefix = formObj.find("input[name='alias']").val();
	var replaceId = formObj.find("input[name='replaceId']").val();
	
	
	$('#currentPageHid_'+prefix).val(1);
	if(asyncFlag=='true'){
		var url = getContextPath() + formObj.attr('action');
		ajaxCommFunPage(url, formObj.serialize(), function(str){
				var ss = $(str).find('#'+replaceId).html();
				$('#'+replaceId).html(ss);
			});
	}else{
		formObj.submit();
	}
};


var search = function(json,currentPage, pageSize) {
	var formId = json["formId"];
	var asyncFlag  = json["asyncFlag"];
	var prefix  = json["prefix"];
	var replaceId = json["replaceId"];
	if(replaceId == null){
		replaceId = json["formId"];
	}
	
	$('#currentPageHid_'+prefix).val(currentPage);
	$('#pageSizeHid_'+prefix).val(pageSize);
	
	var  formObj = $("#"+formId);
	
	var url = getContextPath() + formObj.attr('action');
	if(asyncFlag){
		ajaxCommFunPage(url, formObj.serialize(), function(str){
			var ss = $(str).find('#'+replaceId).html();
			$("#"+replaceId).html(ss);
		});
	}else{
		formObj.submit();
	}
};

function initPageTab(json){
	
	initBaicPageByFM(json);
};


var initBaicPageByFM=function (json){
	var formId = json["formId"];//form表单的Id
	var divId = json["divId"];//form表单内分页标签的DIVId
	var asyncFlag  = json["asyncFlag"];//刷新，无刷新标志 
	var prefix = json["prefix"];//分页标签的标志
	var currentPage = json["currentPage"];//当前页
	var totalPage = json["totalPage"];//一共多少页
	var count = json["count"];//总数
	var pageSize = json["pageSize"];//每页多少条
	var replaceId = json["replaceId"];//需要替换的ID
	if(replaceId == null){
		replaceId = json["formId"];
	}
	
	    
	//初始化页面
    var str = $('#'+divId).html();
    str = str.replace(/currentPageAlias/g,currentPage);
    str = str.replace(/totalPageAlias/g,totalPage);
    str = str.replace(/countAlias/g,count);
    str = str.replace(/pageSizeAlias/g,pageSize);
    str = str.replace(/asyncFlagAlias/g,asyncFlag);
    str = str.replace(/aliasAlias/g,prefix);
    str = str.replace(/replaceIdAlias/g,replaceId);
    str = str.replace(/prefix/g,prefix);
    
    var pageDiv = $('#'+divId);
    pageDiv.html(str);
	var pageStr = getPageSrc(currentPage,pageSize,totalPage,count);
	
	
	//设置页面
	$('#pagingitem_'+prefix).html(pageStr);
	//设置总数 
	$('#totalpage_'+prefix).html(count);
	
	pageDiv.find('[tag=paging-action]').click(function() {
		search(json,std.oid(this),pageSize);
	});
	
	pageDiv.find('#gotoNo_'+prefix).delegate(this,'click',function() {
		goToCurrPageBtn(json,pageSize,totalPage,'pageNo');
	});
	
	pageDiv.find('#pageNo_'+prefix).delegate(this,'keypress',function(e) {
		if (e && e.keyCode == 13) {
			goToCurrPageBtn(json,pageSize,totalPage,'pageNo');
		}
	});
};


var initBaicPage=function (json){
	var formId = json["formId"];//form表单的Id
	var divId = json["divId"];//form表单内分页标签的DIVId
	var asyncFlag  = json["asyncFlag"];//刷新，无刷新标志 
	var prefix = json["prefix"];//分页标签的标志
	var currentPage = json["currentPage"];//当前页
	var totalPage = json["totalPage"];//一共多少页
	var count = json["count"];//总数
	var pageSize = json["pageSize"];//每页多少条
	var replaceId = json["replaceId"];//需要替换的ID
	if(replaceId == null){
		replaceId = json["formId"];
	}
	
	    
	//初始化页面
    var str = $('#'+divId).html();
    str = str.replace(/currentPageAlias/g,currentPage);
    str = str.replace(/totalPageAlias/g,totalPage);
    str = str.replace(/countAlias/g,count);
    str = str.replace(/pageSizeAlias/g,pageSize);
    str = str.replace(/asyncFlagAlias/g,asyncFlag);
    str = str.replace(/aliasAlias/g,prefix);
    str = str.replace(/replaceIdAlias/g,replaceId);
    str = str.replace(/prefix/g,prefix);
    
	$('#'+divId).html(str);
		
  //绑定事件		
  $('#firstPage_'+prefix).delegate(this,'click', function() {
	   firstPage(json,1,pageSize);
    });	
   $('#prePage_'+prefix).delegate(this,'click', function() {
    	prePage(json,currentPage,totalPage,pageSize);
    });
    
    $('#nextPage_'+prefix).delegate(this,'click', function() {
    	nextPage(json,currentPage,totalPage,pageSize);
    });
    
    $('#finalPage_'+prefix).delegate(this,'click', function() {
    	finalPage(json,totalPage,pageSize);
    }); 
    
    $('#finalPage_'+prefix).delegate(this,'click', function() {
    	finalPage(json,totalPage,pageSize);
    }); 
    
    $('#goToCurrPageBtn_'+prefix).delegate(this,'click', function() {
    	goToCurrPageBtn(json,pageSize,totalPage);
    }); 
    
    $('#currPageIpt_'+prefix).delegate(this,'keypress', function(event) {
    	if(event.keyCode == "13")    
        {
    		goToCurrPageBtn(json,pageSize,totalPage);
        }
    }); 
	
};


var prePage = function(json,currentPage, totalPage, pageSize) {
	if (currentPage <= 1) {
		currentPage = 1;
	} else {
		currentPage = currentPage - 1;
	}
	search(json,currentPage, pageSize);
};
var nextPage = function(json,currentPage, totalPage, pageSize) {
	if (currentPage >= totalPage) {
		currentPage = totalPage;
	} else {
		currentPage = currentPage + 1;
	}
	search(json,currentPage, pageSize);
};

var firstPage = function(json,currentPage, pageSize) {
	search(json,currentPage, pageSize);
};

var finalPage = function(json,currentPage, pageSize) {
	search(json,currentPage, pageSize);
};

var goToCurrPageBtn = function(json,pageSize, totalPage,keyId) {
	var prefix = json["prefix"];
	var currPageIptObj = null;
	if(keyId==null){
		currPageIptObj = $("#currPageIpt_"+prefix);
	}else{
		currPageIptObj = $("#"+keyId+"_"+prefix);
	}
	var currPageIpt = currPageIptObj.val();
	if (currPageIpt == "") {
		currPageIptObj.val("");
		win.msg.short("请输入跳转页数!", "W01");
	} else if (parseInt(currPageIpt) > totalPage) {
		currPageIptObj.val("");
		win.msg.short("你输入的页数超出总页数，请输入正确的页数!", "W01");
	} else if (parseInt(currPageIpt) <= 0) {
		currPageIptObj.val("");
		win.msg.short("你输入的页数小于1，请输入正确的页数！", "W01");
	} else {
		search(json,parseInt(currPageIpt), pageSize);
	}
};



var getPageSrc = function(currentpage,pagesize,totalpage,totalsize){
	
		var pg = {};
		pg.currentpage = parseInt(currentpage);
		pg.pagesize = parseInt(pagesize);
		pg.totalpage = parseInt(totalpage);
		pg.totalsize = parseInt(totalsize);

		if (pg.totalpage <= 5) {//五页内
			var middle = [];
			for (var num = 1; num <= pg.totalpage; num++) {
				middle.push(num);
			}
			return renderDom(middle, pg.currentpage, false, false,pg);

		} else if (pg.currentpage <= 3) {//当前页为3页内
			var middle = [ 1, 2 ];
			if (pg.currentpage >= 2) {
				middle.push(3);
			}
			if (pg.currentpage >= 3) {
				middle.push(4);
			}
			return renderDom(middle, pg.currentpage, false, true,pg);

		} else if (pg.totalpage - pg.currentpage <= 2) {//当前页为倒数三页内
			var middle = [];
			if (pg.currentpage <= pg.totalpage - 2) {
				middle.push(pg.totalpage - 3);
			}
			if (pg.currentpage <= pg.totalpage - 1) {
				middle.push(pg.totalpage - 2);
			}
			middle.push(pg.totalpage - 1);
			middle.push(pg.totalpage);

			return renderDom(middle, pg.currentpage, true, false,pg);

		} else {//当前页在中间
			return renderDom([ pg.currentpage - 1, pg.currentpage, pg.currentpage + 1 ], pg.currentpage, true, true,pg);
		}
};

var renderDom = function(middle, active, showMore1, showMore2,pg) {
	var html = '<div class="c_page_num"' + std.flag('paging-action', (active > 1 ? active - 1 : 1)) + '>&lt;</div>';
	if (showMore1) {
		html += '<div class="c_page_num"' + std.flag('paging-action', 1) + '>1</div><div class="c_page_more">...</div>';
	}
	$(middle).each(function(key, item) {
		html += '<div class="c_page_num ' + (active == item ? 'active' : '') + '"' + std.flag('paging-action', item) + '>' + item + '</div>';
	});
	if (showMore2) {
		html += '<div class="c_page_more">...</div><div class="c_page_num"' + std.flag('paging-action',pg.totalpage) + '>' +pg.totalpage + '</div>';
	}
	html += '<div class="c_page_num"' + std.flag('paging-action', (active <pg.totalpage ? active + 1 :pg.totalpage)) + '>&gt;</div>';

	return html;
};

<div class="c_page c_fr c_mt15 c_mb15 search-list-paging">
		
			<div tag="paging-item" id="pagingitem_prefix">
			
			</div>
			<div class="c_page_goto">
				共<span tag="paging-info" oid="totalpage" id="totalpage_prefix"></span>条
			</div>
			<div class="c_page_goto">跳转至</div>
			<div class="c_page_input">
				<input type="text" tag="paging-input" oid="pageNo" id=pageNo_prefix value="currentPageAlias">
			</div>
			<div class="c_page_goto" tag="paging-button" oid="gotoNo" id="gotoNo_prefix">
				<i>GO</i>
			</div>
</div>




<input id="currentPageHid_prefix" type="hidden" name="currentPage" value="currentPageAlias" class="pageTxt" />
<input id="pageSizeHid_prefix" type="hidden" name="pageSize" value="pageSizeAlias" class="pageTxt" />
<input id="asyncFlagHid_prefix" type="hidden" name="asyncFlag" value="asyncFlagAlias" class="pageTxt" />
<input id="aliasHid_prefix" type="hidden" name="alias" value="aliasAlias" class="pageTxt" />
<input id="replaceId_prefix" type="hidden" name="replaceId" value="replaceIdAlias" class="pageTxt" />