JSP標簽之pager-taglib分頁標簽

 

JSP標簽之pager-taglib分頁標簽

 

　　前言：現在進行的項目分頁使用了pager-taglib分頁標簽，個人覺得用起來挺方便的。

1、簡介

　　Pager-taglib 2.0 是一套jsp分頁標簽庫，可以靈活地實現多種不同風格的分頁導航頁面，也可以自定義風格樣式。並且它可以很好的與服務器分頁邏輯分離，它既可以對后台傳入的集合進行分頁，也可以從數據庫中取出要顯示那一頁的數據。

2、標簽介紹

　　1.pg:pager

　　這個標簽用來設置分頁的總體參數，一切分頁標簽都在其內工作。

• url:分頁的鏈接根地址，pager標簽會在這個鏈接的基礎上附加分頁參數
• items:總記錄數，pager標簽正是根據這個值來計算分頁參數的
• maxPageItems:每頁顯示的行數，默認為10
• maxIndexPages:在循環輸出頁碼的時候，最大輸出多少個頁碼，默認是10
• isOffset：與pg:item配套使用 
• export：這個屬性比較重要，文檔也對此作好相對長篇幅的說明。這個屬性是讓標簽給你暴露什么變量，當然這些變量是有選擇的，如在Pager標簽里，可以暴露出來的變量有pageOffset及pageNumber，即頁碼偏移量及頁碼。通過這兩個變量名，可以在Jsp或Java里面從Request里獲得。Export屬性接受的值還有表達式，如currentPage=pageNumber表示，把pageNumber的值暴露出來，並賦給一個叫CurrentPage的變量，這個變量將被保存到Request中，在Jsp或Java中可以得到。

　　2.pg:param

　　用來設置將要加入到URL的參數。使用Name屬性指定即可，用於參數傳遞。

　　3.pg:index

　　這個標簽說明分頁條顯示的內容，在這里你可以設置各種風格的分頁顯示方式。

　　4.pg:first

　　第一頁標簽

• pageUrl - 分頁鏈接URL地址
• pageNumber - 頁碼
• firstItem - 首頁第一行的索引值
• lastItem - 首頁最后一行的索引值

　　5.pg:pre

　　上一頁標簽

• pageUrl - 分頁鏈接URL地址
• pageNumber - 頁碼
• firstItem - 前頁第一行的索引值
• lastItem - 前頁最后一行的索引值

　　6.pg:pages

　　這個標簽用來循環輸出頁碼信息

• pageUrl - 分頁鏈接URL地址
• pageNumber - 頁碼
• firstItem - pageNumber這個頁碼指定的那一頁的第一行的索引值
• lastItem - pageNumber這個頁碼指定的那一頁的最后一行的索引值

　　7.pg:next

　　下一頁標簽

• pageUrl - 分頁鏈接URL地址
• pageNumber - 頁碼
• firstItem - 下頁第一行的索引值
• lastItem - 下頁最后一行的索引值

　　8.pg:last

　　最后一頁標簽

• pageUrl - 分頁鏈接URL地址
• pageNumber - 頁碼
• firstItem - 尾頁第一行的索引值
• lastItem - 尾頁最后一行的索引值

3、兩種分頁方式實例

　　首先把pager-taglib-2.0.jar放入工程的lib下。

　　然后在分頁JSP中引入<%@ taglib uri="http://jsptags.com/tags/navigation/pager" prefix="pg"%>。

　　1、從后台傳入List結果集，在頁面上通過<pg:item>對List進行自動分頁

<%@ taglib uri="http://jsptags.com/tags/navigation/pager" prefix="pg"%>

<pg:pager url="${pageContext.request.contextPath}/sysParamAction.do" index="center"
    maxPageItems="10" maxIndexPages="10" isOffset="<%=false%>"
    export="pageOffset,currentPageNumber=pageNumber" scope="request">
    <pg:param name="m" value="findSysparams" />

    <table>
        <tr>
            <td colspan="2">XX列表</td>
        </tr>
        <tr>
            <td>XX</td>
            <td>XX</td>
        </tr>
        <c:forEach items="${list }" var="list" varStatus="listStatus">
            <pg:item>
                <c:if test="${1 == listStatus.count % 2 }">
                    <tr class="tab_list_tr2" 
                        onmouseover= this.className = 'tab_list_tr_hover';;
                        onmouseOut= this.className = 'tab_list_tr2';;>
                </c:if>
                <c:if test="${0 == listStatus.count % 2 }">
                    <tr class="tab_list_tr"
                        onmouseover= this.className = 'tab_list_tr_hover';;
                        onmouseOut= this.className = 'tab_list_tr';;>
                </c:if>
                    <td>${list.xx }</td>
                    <td>${list.xx }</td>
                </tr>
            </pg:item>
        </c:forEach>
    </table>

    <pg:index>
        <pg:first>
            <a href="<%=pageUrl%>"><img src="${ctx}/images/grid/firstPage.gif" border="0"></a>
        </pg:first>
        <pg:prev>
            <a href="<%=pageUrl%>"><img src="${ctx}/images/grid/prevPage.gif" border="0"></a>
        </pg:prev>
        <pg:pages>
            <c:choose>
                <c:when test="${pageNumber eq currentPageNumber}">
                    <font color="red">[<%=pageNumber%>]</font>
                </c:when>
                <c:otherwise>
                    <a href="<%=pageUrl%>"><%=pageNumber%></a>
                </c:otherwise>
            </c:choose>
        </pg:pages>
        <pg:next>
            <a href="<%=pageUrl%>"><img src="${ctx}/images/grid/nextPage.gif" border="0"></a>
        </pg:next>
        <pg:last>
            <a href="<%=pageUrl%>"><img src="${ctx}/images/grid/lastPage.gif" border="0"></a>
        </pg:last>
        一共${fn:length(list) }條記錄
    </pg:index>
</pg:pager>

　　2、通過把 pageSize,pageNo兩參數傳給后台進行數據庫分頁

　　與頁面自行分頁不同的是還需要給后台傳兩個參數。一個是pageNo（當前頁數），可以在每一個PageUrl后面都加上&pageNo=<%= pageNumber %>。讓我們的URL帶上頁碼的參數，這樣程序可以拿到頁碼去查找所需要的數據。另一個參數是pagesize,這個原本可以在url=”/PageAction.do?pagesize=5來做可是，<pg>標簽不支持這樣做，但它給我們提供了另一個傳遞變量的方法，<pg:param name=" pagesize " value="5" />。

<%@ taglib uri="http://jsptags.com/tags/navigation/pager" prefix="pg"%>

<pg:pager items="${page.totalCount}" url="${pageContext.request.contextPath}/sysParamAction.do" 
        index="center" maxPageItems="5" maxIndexPages="10" isOffset="<%=false%>"
        export="pageOffset,currentPageNumber=pageNumber" scope="request">
    <pg:param name="m" value="findSysparams" />
    <pg:param name="pagesize"  value="5" />

    <table>
        <tr>
            <td colspan="2">XX列表</td>
        </tr>
        <tr>
            <td>XX</td>
            <td>XX</td>
        </tr>
        <c:forEach items="${list }" var="list" varStatus="listStatus">
            <c:if test="${1 == listStatus.count % 2 }">
                <tr class="tab_list_tr2" 
                    onmouseover= this.className = 'tab_list_tr_hover';;
                    onmouseOut= this.className = 'tab_list_tr2';;>
            </c:if>
            <c:if test="${0 == listStatus.count % 2 }">
                <tr class="tab_list_tr"
                    onmouseover= this.className = 'tab_list_tr_hover';;
                    onmouseOut= this.className = 'tab_list_tr';;>
            </c:if>
                <td>${list.xx }</td>
                <td>${list.xx }</td>
            </tr>
        </c:forEach>
    </table>

    <pg:index>
        <pg:first>
            <a href="<%=pageUrl%>&pageNo=<%=pageNumber%>"><img src="${ctx}/images/grid/firstPage.gif" border="0"></a>
        </pg:first>
        <pg:prev>
            <a href="<%=pageUrl%>&pageNo=<%=pageNumber%>"><img src="${ctx}/images/grid/prevPage.gif" border="0"></a>
        </pg:prev>
        <pg:pages>
            <c:choose>
                <c:when test="${pageNumber eq currentPageNumber}">
                    <font color="red">[<%=pageNumber%>]</font>
                </c:when>
                <c:otherwise>
                    <a href="<%=pageUrl%>&pageNo=<%=pageNumber%>"><%=pageNumber%></a>
                </c:otherwise>
            </c:choose>
        </pg:pages>
        <pg:next>
            <a href="<%=pageUrl%>&pageNo=<%=pageNumber%>"><img src="${ctx}/images/grid/nextPage.gif" border="0"></a>
        </pg:next>
        <pg:last>
            <a href="<%=pageUrl%>&pageNo=<%=pageNumber%>"><img src="${ctx}/images/grid/lastPage.gif" border="0"></a>
        </pg:last>
        一共${fn:length(list) }條記錄
    </pg:index>
</pg:pager>