分頁技術框架（Pager-taglib）學習一（頁面分頁）

一、Pager-taglib簡介
    1、Pager-taglib，支持多種風格的分頁顯示。實際上她是一個Jsp標簽庫，為在JSP上顯示分頁信息而設計的一套標簽，通過這些標簽的不同的組合，會形成多種不一樣的分頁頁面，風格各異，她自帶的DEMO就有八種左右的分頁風格（在pager-taglib-2.0.war包下的WEB-INF\jsp 中），包括Google的分頁風格。而需要訂制自已的風格的分頁頁面也非常簡單。
   2、分頁方式有兩種：
    一種是：頁面分頁，即從Action或者其他控制器中得到一個List，在頁面上 通過<pg:item>進行自動分頁。適合查詢結果不大的情況。
    第二種是：數據庫分頁，即通過把 pageSize,pageNo兩參數傳給后台進行數據庫分頁。 適合大量查詢。

   二、Pager-taglib標簽詳解
   1、<pg:pager>標簽（分頁時我們重點設置的就是這個標簽）：這個標簽用來設置分頁的總體參數，重要參數說明：
     url:分頁的鏈接根地址，pager標簽會在這個鏈接上附加分頁參數pager.offset,后台可根據這個參數分頁， 也可自行在URL上添加參數。

    items:總記錄數，pager標簽正是根據這個值來計算分頁參數的。在頁面分頁時，此參數可以不寫，后台會自動計算出分頁參數。如果你寫的話將以你寫的為准。

    maxPageItems:每頁顯示的行數，也即每頁顯示的記錄數，默認為10。 不寫此標簽，你會發現分頁的條數在小於10的時候顯示不出來一些數據。當大於10的時候則會出現重復的記錄！ 如：maxPageItems = "4"

    maxIndexPages:在循環輸出頁碼的時候，最大輸出多少個頁碼（也就是最多顯示多少個頁碼），默認是10.如：maxIndexPages="3"

     export：這個屬性比較重要，這個屬性是讓標簽給你暴露什么變量，當然這些變量是有選擇的，如在Pager標簽里，可以暴露出來的變量有 pageOffset及pageNumber，即頁碼偏移量及頁碼。通過這兩個變量名，可以在Jsp或servlet(或者Action)里面從Request里獲得。Export屬性接受的值還有表達式，
如currentPage=pageNumber表示，把pageNumber的值暴露出來，並賦給一個叫CurrentPage（自定義的）的變量，這個變量將被保存到Request中，在Jsp或servlet中可以得到。通常設為:export="pageOffset,currentPageNumber=pageNumber".這里使用currentPageNumber=pageNumber的原因是pg：pages（不是page）標簽輸出用於存放每次循環的頁碼號的變量也叫pageNumber。
   
     scope：將export暴漏出變量，設置器存儲范圍。取值為：request、session等。默認保存在request范圍內。

     isOffset：是否允許頁面偏移。取值為true、false。如果為true的話，點擊頁碼分頁時，分頁中的內容是不會有變化的，並且頁碼可以一直向后延伸（不論是否已到達你的尾頁）；設為false的話會正常分頁。默認false。
    index：設置索引頁的動態顯示方式。取值為：center（默認）、forward、half-full。具體效果自己設置查看。
    
 
說明：當我們選擇不同的頁號，會動態的出現其他頁號，我們稱之為二級分頁。適用於查詢結果較多，分頁頁數也比較多的情況，這時我們有必要對分頁頁號再進行分頁顯示。此時我們可以通過設置maxIndexPages和index兩個屬性來實現二級分頁。
   2、<pg:param>：
    這個標簽很有用，用來設置將要加入到URL的參數,將傳入后台。使用Name屬性指定即可。
   3、<pg:item>:
     表示一頁中的一項，pager標簽庫可根據這個項的個數來計算分頁參數（pageOffset），通常放在jstl循環中。
   4、<pg:index>：
    這個標簽說明分頁條顯示的內容,它可以包含下面這些標記。

   5、<pg:first>：
   【第一頁的標簽】重要參數說明：
export變量的意義：
pageUrl - 分頁鏈接URL地址（最重要的export參數，即框架暴漏出的參數）
pageNumber - 頁碼
firstItem - 首頁第一條記錄的索引值
lastItem - 首頁最后一條記錄的索引值

   6、<pg:prev>：
   【上一頁標簽】重要參數說明：
export變量的意義：
pageUrl - 分頁鏈接URL地址（最重要的export參數，即框架暴漏出的參數）
pageNumber - 頁碼

    7、<pg:next>
    【下一頁標簽】重要參數說明：
export變量的意義：
pageUrl - 分頁鏈接URL地址（最重要的export參數，即框架暴漏出的參數）
pageNumber - 頁碼

    8、<pg:last>重要參數說明：
export變量的意義：
pageUrl - 分頁鏈接URL地址（最重要的export參數，即框架暴漏出的參數）
pageNumber - 頁碼

    9、<pg:pages>【這個標簽用來循環輸出頁碼信息】重要參數說明：
export變量的意義：
pageUrl - 分頁鏈接URL地址（最重要的export參數，即框架暴漏出的參數）
pageNumber - 頁碼
firstItem - pageNumber這個頁碼指定的那一頁的第一行的索引值
lastItem - pageNumber這個頁碼指定的那一頁的最后一行的索引值

  三、頁面分頁pager-taglib標簽的基本結構
 

  注意：<pg:index>標簽主要是分頁導航的風格，我們可以自定義（如下面示例中的兩個風格，其實也是改編自war包中八種風格的jsp文件），也可以使用在pager-taglib-2.0.war包下的WEB-INF\jsp 八種風格的jsp文件，即使用靜態導入或者動態導入的方式。如
     <pg:index>
      <%@ include file="/WEB-INF/jsp/google.jsp"%>
     </pg:index>
 
     <pg:index>
     <jsp:include page="/WEB-INF/jsp/pager_conn.jsp" flush="true"></jsp:include>
     </pg:index>
  靜態導入前提：兩頁面合並后一定要能正確編譯（即合並后一定要有6中的兩個jsp頁面指令，合並前這兩個指令分散在哪個頁面無所謂）
  動態導入前提：要包含的風格文件能夠獨立編譯（即一定要導入5中的兩個jsp頁面指令）
 值得注意的是：八種風格的jsp文件必須拷到/WEB-INF/jsp/目錄下，並且每個jsp文件中的jsp動作指令標簽（如<jsp:useBean >） 要刪除。

  呵呵，有了這些，我們分頁的重點就是設置pg:pager標簽的總體屬性啦

  四、Pager-taglib頁面分頁示例
    1、導入pager-taglib.jar到類路徑下
    到官網http://jsptags.com/tags/navigation/pager/index.jsp下載pager-taglib-2.0.war。
在pager-taglib-2.0.war包下的WEB-INF\jsp 中包含了此框架默認的8中分頁風格。
   2、新建實體類Book.java
    package entity;
public class Book
{
    private String name;
    private float price;
    public Book()
    {
        // TODO Auto-generated constructor stub
    }
    public Book(String name,float price)
    {
        this.setName(name);
        this.setPrice(price);
    }
    public String getName()
    {
        return name;
    }
    public void setName(String name)
    {
        this.name = name;
    }
    public float getPrice()
    {
        return price;
    }
    public void setPrice(float price)
    {
        this.price = price;
    }
}
 3、新建控制器PagerServlet.java
   public class PagerServlet extends HttpServlet
{
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException
    {

        doPost(request, response);
    }
   
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException
    {

        response.setContentType("text/html; charset=utf-8");
        PrintWriter out = response.getWriter();
        List<Book> books=null;
        if(books==null)
        {
         books = new ArrayList<Book>();
        Book b1 = new Book("物理1", 15);
        Book b2 = new Book("物理10", 10);
        Book b3 = new Book("物理9", 20);
        Book b4 = new Book("物理8", 30);
        Book b5 = new Book("物理7", 40);
        Book b6 = new Book("物理6", 50);
        Book b7 = new Book("物理5", 60);
        Book b8 = new Book("物理4", 70);
        Book b9= new Book("物理3", 80);
        Book b10 = new Book("物理2", 90);
        books.add(b10);
        books.add(b9);
        books.add(b8);
        books.add(b7);
        books.add(b6);
        books.add(b5);
        books.add(b4);
        books.add(b3);
        books.add(b2);
        books.add(b1);
        request.getSession().setAttribute("books", books);
        }
        //頁面翻頁的普通樣式
        request.getRequestDispatcher("/book_list_comm.jsp").forward(request, response);
        //谷歌樣式的頁面翻頁
        //request.getRequestDispatcher("/book_list_google.jsp").forward(request, response);
        out.flush();
        out.close();
    }
}
 3、在web.xml中配置PagerServlet.java
   <servlet>
    <description>分頁控制器</description>
    <servlet-name>PagerServlet</servlet-name>
    <servlet-class>servlet.PagerServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>PagerServlet</servlet-name>
    <url-pattern>/PagerServlet</url-pattern>
  </servlet-mapping>
4、新建普通風格分頁頁面（核心部分）book_list_comm.jsp（最重要）
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://jsptags.com/tags/navigation/pager" prefix="pg" %>
 
 body元素中添加：
 <pg:pager url="book_list_comm.jsp" maxPageItems = "3" maxIndexPages="3" export="offset,currentPageNumber=pageNumber" isOffset="false"  index="half-full"  >  
     <table width="778" border="0" cellPadding="0" cellSpacing="1" bgcolor="#6386d6">  
        <tr bgcolor="#EFF3F7">  
          <TD align="center">書名</TD>  
          <TD align="center">價格</TD>  
             
        </tr>  
        <c:if test="${!empty books}">  
          <c:forEach items="${books}" var="book">
          <pg:item>
            <tr bgcolor="#EFF3F7">  
              <td align="center">${book.name }</td>  
              <td align="center">${book.price }</td>  
            </tr> 
            </pg:item>  
          </c:forEach>  
          </c:if>  
            <c:if test="${empty books}">  
         <tr>  
            <td colspan="5" align="center" bgcolor="#EFF3F7">  
            沒有找到相應的記錄  
            </td>  
         </tr>  
         </c:if>  
        </table>

  <%-- 定義分頁風格：普通風格 --%> 
  <pg:index>
  <pg:first>  
    <a href="${pageUrl}">首頁</a>  
  </pg:first>  
  <pg:prev>  
    <a href="${pageUrl }">上一頁</a>  
  </pg:prev>  
  <pg:pages>  
    <c:choose>
         <%--當循環頁碼是當前頁碼，則該頁碼不可以導航，並顯示為紅色--%>
      <c:when test="${currentPageNumber eq pageNumber}">  
        <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 }">下一頁</a>  
  </pg:next>  
  <pg:last>  
    <a href="${pageUrl }">尾頁</a>  
  </pg:last>
  </pg:index>  
</pg:pager>  
  5、新建谷歌風格的分頁界面（核心部分）：book_list_google.jsp（最重要）
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://jsptags.com/tags/navigation/pager" prefix="pg" %>

<pg:pager url="book_list_google.jsp"  index="half-full" export="currentPageNumber=pageNumber" maxPageItems="3" maxIndexPages="3">
    
      <table width="778" border="0" cellPadding="0" cellSpacing="1" bgcolor="#6386d6">  
        <tr bgcolor="#EFF3F7">  
          <TD align="center">書名</TD>  
          <TD align="center">價格</TD>  
             
        </tr>  
        <c:if test="${!empty books}">  
          <c:forEach items="${books}" var="book">
          <pg:item>
            <tr bgcolor="#EFF3F7">  
              <td align="center">${book.name }</td>  
              <td align="center">${book.price }</td>  
            </tr> 
            </pg:item>  
          </c:forEach>  
          </c:if>  
            <c:if test="${empty books}">  
         <tr>  
            <td colspan="5" align="center" bgcolor="#EFF3F7">  
            沒有找到相應的記錄  
            </td>  
         </tr>  
         </c:if>  
        </table>
      
       <%--定義風衣風格：谷歌風格 --%>
      <%--  使用靜態導入谷歌風格 （如不理解，請參考標題三）
             <pg:index>
             <%@ include file="/WEB-INF/jsp/google.jsp"%>
             </pg:index>
         --%>      
    <pg:index>
      <center>
      <table border=0 cellpadding=0 width=10% cellspacing=0>
      <tr align=center valign=top>
      <td valign=bottom><font face=arial,sans-serif 
        size=-1>Result Page: </font></td>
      <pg:prev ifnull="true">
        <% if (pageUrl != null) { %>
          <td align=right><A HREF="<%= pageUrl %>"><IMG
            SRC=http://www.google.com/nav_previous.gif alt="" border=0><br>
          <b>Previous</b></A></td>
        <% } else { %>
          <td><IMG SRC=http://www.google.com/nav_first.gif alt="" border=0></td>
        <% } %>
      </pg:prev>
      <pg:pages>
        <% if (pageNumber == currentPageNumber) { %>
          <td><IMG SRC=http://www.google.com/nav_current.gif alt=""><br>
          <font color=#A90A08><%= pageNumber %></font></td>
        <% } else { %>
          <td><A HREF="<%= pageUrl %>"><IMG
            SRC=http://www.google.com/nav_page.gif alt="" border=0><br>
          <%= pageNumber %></A></td>
        <% } %>
      </pg:pages>
      <pg:next ifnull="true">
        <% if (pageUrl != null) { %>
          <td><A HREF="<%= pageUrl %>"><IMG
            SRC=http://www.google.com/nav_next.gif alt="" border=0><br>
          <b>Next</b></A></td>
        <% } else { %>
          <td><IMG SRC=http://www.google.com/nav_last.gif alt="" border=0></td>
        <% } %>
      </pg:next>
      </tr>
      </table>
      </center>
    </pg:index>
   </pg:pager>
在瀏覽器中輸入：http://localhost:8888/Pager-taglib/PagerServlet
可以看到兩種分頁風格的的分頁：
普通風格：

谷歌風格：