模板分页封装

 

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){
	
	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) {
	var prefix = json["prefix"];
	var currPageIptObj = $("#currPageIpt_"+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);
	}
};

 

 

   

<a href="javascript:void(0);" id="firstPage_prefix">首页</a>
<a href="javascript:void(0);" id="prePage_prefix">上一页</a>
<a href="javascript:void(0);" id="nextPage_prefix">下一页</a>
<a href="javascript:void(0);" id="finalPage_prefix">末页</a>
<span>当前<i>currentPageAlias</i>/totalPageAlias页</span>
<span>共<i>countAlias</i>条记录</span>
<span>pageSizeAlias条记录/页</span>
<span>
	转到<input id="currPageIpt_prefix" type="text" value="currentPageAlias" class="pageTxt" />
	<a href="javascript:void(0);" id="goToCurrPageBtn_prefix" class="pageBut">跳转</a>
</span>
<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" />

 

  

<script type="text/javascript">
			 $(function(){
				 var json = 
				 {
						 formId:"form2",
						 divId:"div2",
						 asyncFlag:true,
						 prefix:"2",
						 currentPage:$!currentPage,
						 totalPage:$!totalPage,
						 count:$!count,
						 pageSize:$!pageSize
				 };
				 initPageTab(json);
			 });
		    </script>