springmvc 帶查詢條件的分頁，form的控制範圍，怎麼包裹條件送出給背景

分頁效果圖：

分頁技術發展很多年，我一直想找一個簡單好了解的方式去分頁，我下面的文章是提供一種思路。因為寫的比較跳躍，這文章适合有分頁基礎的同學。

此篇文章用的技術：springmvc+hibernate+oracle,用的主要是hibernate的分頁，可以去看看原理

例如：

Hibernate List可以實作分頁查詢：從第2萬條開始，取出100條記錄
         Query q = session.createQuery("from Cat as c");
         q.setFirstResult(20000);
         q.setMaxResults(100);
         List l = q.list();
           

分頁

  一 分頁需要的參數：       

0 從jsp傳給背景查詢條件的參數，例如根據性别和位址查詢：public class user{sex性别，address位址}

1  從jsp傳給背景兩個參數：1.1 目前頁( currentPage 如目前頁是第三頁,你點選5，頁面跳轉到了第五頁，目前頁是5)，1.2  每頁顯示記錄 條數(pageSize每頁展示五條)

2  查詢資料庫擷取：2.1 總記錄數(totalcount 資料庫中總共多少條資料),2.2 目前頁面要展示的資料集合(conentList 頁面所有要展示的資料，頁面周遊這個集合展示資料)

3 由上面幾個參數計算擷取 ：3.1 總頁數(pageCount頁面總共展示多少頁，最少一頁，你可以設定最多十頁，多于十頁隻展示十頁，頁面具體展示多少頁要計算)，3.2 起始頁(firstPage)碼，3.3 結束頁碼(lastPage)。

 以上0裡面的sex和address封裝到user對象裡，1-3參數封裝成一個page對象裡，網上有很多例子。我待會提供兩個網上的例子。  public class page{              currentPage ;

             pageSize;

             totalcount; 

             conentList ;//**********注意：頁面展示要周遊的資料，從資料查詢的結果都放在這個list裡

             pageCount;

             firstPage;

             lastPage;

}

先概覽整個js和jsp源碼，下面會對每段代碼都講解（看不清，另存為檢視）

注意，點選查詢和點選頁碼跳轉的不同： 點選查詢帶着查詢條件(選擇性别和區域)和目前頁(currentPage)，因為查詢後肯定從第一頁顯示，是以目前頁為1。 點選頁碼跳轉要帶查詢條件和目前頁，但是這個目前頁不一定是1，你點選第五頁，頁面跳轉到了第五頁，目前頁就為5，點選第三頁後，頁面跳轉到了第三頁，目前頁就為3，和你點選的頁數相關。

二 點選按條件查詢或點選跳頁後查詢

按條件查詢：

假如：背景查詢後傳回pages和查詢條件user

form的id="formId"
jsp部分:
<form id="formId" action="${pageContext.request.contextPath}/你的url......................." method="post">
 
<select id="sex" name="sex" value="" >
	<option value="" }>請選擇性别</option>
	<option value="1" ${user.sex=="1"?'selected':''}>男</option>
	<option value="2" ${user.sex=="2"?'selected':''}>女</option>				                     	                      
 </select>

<div οnclick="pageCondition('currentPage')">查詢</div>

js部分:
function pageCondition(currentPage){
	
		$("#formId").append('<input  id="currentPage" type="hidden" name="currentPage" value="1" />');
			
		$("#formId").submit();
	}
          
           

點選跳頁

jsp部分：
<a href="javascript:void(0)" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  class="item">頁次：${currentPage }/${pageCount}</a> 
                           
<a onClick='gotoPage("1")' href="javascript:void(0)" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  class="item" >首頁</a>
<c:forEach  begin="${pages.firstPage}" end="${pages.lastPage}" var="s">					
								
	<a onClick='gotoPage(${s})' href="javascript:void(0)" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  class="item" >${s}</a>
								
</c:forEach>												
<a οnclick="gotoPage(${lastPage})" href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  title="尾頁" class="item">尾頁</a>
js部分：
function gotoPage(currentPage){
	
		$("#formId").append('<input value="'+currentPage+'" id="currentPage" type="hidden" name="currentPage"/>');
		
		$("#formId").submit();
}
           

三 查詢到結果後jsp展示查詢到的資料

假如：背景查詢後傳回pages和查詢條件user

1 查詢條件部分的回顯：

<span style="font-family:Microsoft YaHei;"><select id="sex" name="sex" value="" >
	<option value="" }>請選擇性别</option>
	<option value="1" ${user.sex=="1"?'selected':''}>男</option>
	<option value="2" ${user.sex=="2"?'selected':''}>女</option>				                     	                      
 </select></span>
           

2 table周遊結果部分：

         參見上文：2.2 目前頁面要展示的資料集合(conentList 頁面所有要展示的資料，頁面周遊這個集合展示資料)，       <c:forEach items="${pages.conentList }" var="page" >            ....................       </c:forEach>

3  頁碼部分回顯

<a href="javascript:void(0)" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  class="item">頁次：${<currentPage}/${pageCount}</a> 
                           
<a onClick='gotoPage("1")' href="javascript:void(0)" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  class="item" >首頁</a>
<c:forEach  begin="${pages.firstPage}" end="${pages.lastPage}" var="s">					
								
	<a onClick='gotoPage(${s})' href="javascript:void(0)" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  class="item" >${s}</a>
								
</c:forEach>												
<a οnclick="gotoPage(${lastPage})" href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  title="尾頁" class="item">尾頁</a>
           

四：寫在最後

2016-04-29-重新排版 我的所有部落格目錄: http://blog.csdn.net/wabiaozia?viewmode=contents