笔记--------手动分页

1.页面 绑定page对象的  pageSize每页大小 和 pageCurren当前页数（隐藏域中保存这两个值），首次请求后台后，把值放上去。

2.首页，上一页，当前页，下一页，尾页。绑定事件，动态改变pageCurren的值，然后发送请求后台。

3. 每次后台查询出 总的行数totalRows，根据 pageSize计算出总页数totalPages  (totalRows/pageSize),

　　oracle: 开始行数：startRow = (currentPage - 1) * pageSize;   结束行数：currentPage* pageSize

<div id="pageNumDiv" style="margin-top: 5px;">
    <div style="float: left;">
       <select id="pageSizeSelect" style="height: 20px">   
          <option value="20" selected="selected">20</option>
          <option value="50">50</option>
          <option value="100">100</option>
       </select>
    </div>
    <div style="float: left;">
        <img id="topImg" alt="第一页" src="${pageContext.request.contextPath}/css/common/images/first.gif" style="padding-top: 4px;cursor:pointer;">
    </div>
    <div style="float: left;">
        <img id="prevImg" alt="上一页" src="${pageContext.request.contextPath}/css/common/images/prev.gif" style="padding-top: 4px;cursor:pointer;">
    </div>
    <div style="float: left;">
                           当前页<input type="text" id="txtCurrPage" value="1" style="height: 20px" size="4"/>总页数<span>1</span>
    </div>
    <div style="float: left;">
          <img id="nextImg" alt="下一页" src="${pageContext.request.contextPath}/css/common/images/next.gif" style="padding-top: 4px;cursor:pointer;">
    </div>
    <div style="float: left;">
        <img id="lastImg" alt="最后一页" src="${pageContext.request.contextPath}/css/common/images/last.gif" style="padding-top: 4px;cursor:pointer;">
       </div>
</div>

$("#flightDetailListSearchBtn").click(function(){
        $("#txtCurrPage").val("1");
        searchInfo();
    });


    $("#pageNumDiv div:eq(1)").click(function(){//第一页
        $("#txtCurrPage").val(1);
        searchInfo();
    });
    $("#pageNumDiv div:eq(2)").click(function(){//上一页
        var prePage =  Number($("#txtCurrPage").val())-1;
        if(!isNaN($("#txtCurrPage").val()) && prePage > 0 ){
            $("#txtCurrPage").val( prePage );
            searchInfo();
        }
    });
    $("#pageNumDiv div:eq(4)").click(function(){//下一页
        var nextPage = Number($("#txtCurrPage").val())+1;
        if(!isNaN($("#txtCurrPage").val()) && nextPage <= totalPage){
            $("#txtCurrPage").val(nextPage);
            searchInfo();
        }
    });
    $("#txtCurrPage").keydown(function(event){//回车键
        if(event.keyCode=="13"){
            if(!isNaN($(this).val())){
                searchInfo();
            }
        }
    });
    $("#pageNumDiv div:eq(5)").click(function(){//最后一页
        $("#txtCurrPage").val(totalPage);
        searchInfo();
    });
    $("#pageNumDiv select").change(function(){
        searchInfo();
    });

function searchInfo(){
        firstOpen++;
        //分页设置
        $("#pageSize").val($("#pageSizeSelect").val());
        $("#currentPage").val($("#txtCurrPage").val());
        var data = $("#flightDetailListSearchForm").serialize();

        $("#flightDetailListDiv").parent().find(".ui-button-text").eq(0).attr("params",data);//绑定参数
        //生成遮盖
        converflexigrid("#flightDetailListWithChooseDiv");
        $.post($path+"/mc/foilManage/goodAnalysisshowList",data,function($data){
            //返回数据之后隐藏遮盖
            removeConverflexigrid("#flightDetailListWithChooseDiv");
            var errorMessage = $data.errorMessage;
            if(errorMessage!=undefined ){
                hiAlert(errorMessage,"提示");
            }else {
                var vwStatisticalAnalysisList = $data.vwStatisticalAnalysisList;
                var html = "";
                //$("#moreFoilDetail tr:gt(0)").remove();
                $("#moreFoilDetailList tr").remove();
                if (vwStatisticalAnalysisList != undefined && vwStatisticalAnalysisList.length > 0) {
                    for (var i = 0; i < vwStatisticalAnalysisList.length; i++) {
                        if (i % 2 == 0) {
                            html = html + "<tr style='background-color: rgb(220, 220, 220);'>";
                        }
                        var moreFoil = vwStatisticalAnalysisList[i];
                        for (var j = 0; j < vwStatisticalAnalysisparamters.length; j++) {
                            var showValue = "";
                            if(moreFoil[vwStatisticalAnalysisparamters[j]]!= undefined ){
                                showValue = moreFoil[vwStatisticalAnalysisparamters[j]];
                            }
                            html = html + "<td><div class='dataManage_td_div3' style='width:100%;"+tableWidthCss[j]+"'>" + showValue + "</div></td>";
                        }
                        html = html + "</tr>";
                    }
                    var pager = $data.pager;
                    $("#pageNumDiv div span").html(pager.totalPages);
                    totalPage = pager.totalPages;
                    $("#totalRows").html("总数:"+pager.totalRows);
                } else {
                    //html = html + "<tr><td colspan='" + vwStatisticalAnalysisColumns.length + "'>暂无数据</td></tr>";
                    var pager = $data.pager;
                    $("#pageNumDiv div span").html("1");
                    totalPage = pager.totalPages;
                    $("#totalRows").html("无记录数");
                    $("#currentPage").val("1");
                }
                $("#moreFoilDetailList").append(html);
            }
        },'json');

 

后台page核心代码如下：

	public void setTotalRows(int totalRows) {
		this.totalRows = totalRows;
		this.totalPages = totalRows / pageSize;
		int mod = totalRows % pageSize;
		if (mod > 0) {
			this.totalPages++;
		}
		if (this.currentPage > totalPages){
			if(isFor){
				int forSize = currentPage%totalPages;
				if(forSize>0){
					currentPage=forSize;
				}else{
					currentPage = totalPages;
				}
			}else{
				this.currentPage = totalPages;
			}
		}
		this.startRow = (currentPage - 1) * pageSize;
		if (this.startRow < 0) {
			startRow = 0;
		}
		if (this.currentPage == 0 || this.currentPage < 0) {
			currentPage = 1;
		}
	}