主頁 > 知識庫 > JSP實(shí)現(xiàn)帶查詢條件的通用分頁組件

JSP實(shí)現(xiàn)帶查詢條件的通用分頁組件

熱門標(biāo)簽:南通通訊外呼系統(tǒng)產(chǎn)品介紹 潤滑油銷售電銷機(jī)器人 自繪地圖標(biāo)注數(shù)據(jù) 電銷機(jī)器人免培訓(xùn) 外呼系統(tǒng)使用方法 海外圖書館地圖標(biāo)注點(diǎn) 如何看懂地圖標(biāo)注點(diǎn) 給地圖標(biāo)注得傭金 電話機(jī)器人需要使用網(wǎng)絡(luò)嗎

分頁功能的代碼就是這樣的,在需要展示列表的頁面,我們基本都需要加上分頁功能,如果某天boss想要修改分頁功能的樣式,我們不能去一個(gè)一個(gè)的改吧。

下邊給大家分享一個(gè)自己封裝的通用分頁組件。

1. 效果展示

2. 使用方式

1 )在需要顯示分頁信息的位置,直接引入pagination.jsp頁面。

!-- 分頁內(nèi)容 -->
 %@include file="/WEB-INF/decorators/pagination.jsp" %>
!-- 分頁內(nèi)容結(jié)束 -->

2 )在java代碼中

Controller層代碼:

@RequiresPermissions("func_vasadmin_userMoneyList")
@RequestMapping("/user/money/list")
public String list(Model model, ServletRequest request) {
 
 // 獲取所有的查詢條件參數(shù)(為了使用方便,所有查詢條件的參數(shù)命名前綴都是"search_")
 MapString, Object> searchParams = WebUtils.getParametersStartingWith(request, "search_");
 
 // 獲取分頁頁碼信息和每頁條數(shù)
 int pageNum = PageUtil.getTargetPage(request);
 int pageSize = PageUtil.getPageSize(request);
 Page page = new Page(pageSize, pageNum);
 
 // 查詢需要展示的內(nèi)容
 ListUserMoney> list = vasMoneyService.getUserMoneyList(page,searchParams);
 
 model.addAttribute("data", list);
 model.addAttribute("page", page);
 // 將搜索條件編碼成字符串,用于排序,分頁的URL
 model.addAttribute("searchParams", PageUtil.encodeParameterStringWithPrefix(searchParams, "search_"));
 
 return "vasadmin/user_money_list";
}

Service層代碼:

public ListUserMoney> getUserMoneyList(Page page,
 MapString, Object> searchParams) {

 // 從map中獲取查詢條件
 long userId = (Long) DataConvertUtil.data2(searchParams.get("userId"),
 DataConvertUtil.DataType.LONG);
 long minMoney = (Long) DataConvertUtil.data2(
 searchParams.get("minMoney"), DataConvertUtil.DataType.LONG);
 long maxMoney = (Long) DataConvertUtil.data2(
 searchParams.get("maxMoney"), DataConvertUtil.DataType.LONG);

 // 查詢總條數(shù)
 int totleElements = vasMoneyDao.getUserMoneyListCount(
 DataBaseName.DB_TATA_MONEY, userId, minMoney, maxMoney);
 // 設(shè)置總條數(shù)
 page.setTotleElements(totleElements);

 // 查詢需要展示的數(shù)據(jù)
 return vasMoneyDao.getUserMoneyList(DataBaseName.DB_TATA_MONEY, userId,
 minMoney, maxMoney, page.getStartNum(), page.getEndNum());
}

**每次需要分頁,只需要操作上邊這兩步,是不是很簡單啊~~。**接下來,給大家貼出封裝的pagination.jsp代碼,和其它的一些幫助類的代碼。

**3. 代碼示例 **

pagination.jsp (封裝的通用分頁代碼)

%@ page language="java" pageEncoding="UTF-8"%>
%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

!-- 分頁信息 -->
div class="row">
 div class="col-md-3 page-number">
 每次顯示 select class="form-control input-mini"
 onchange="self.location.href=options[selectedIndex].value">
 option value="?pageNum=1pageSize=10${searchParams}"
 c:if test="${page.pageSize eq '10' }">selected/c:if>>10/option>
 option value="?pageNum=1pageSize=50${searchParams}"
 c:if test="${page.pageSize eq '50' }">selected/c:if>>50/option>
 option value="?pageNum=1pageSize=100${searchParams}"
 c:if test="${page.pageSize eq '100' }">selected/c:if>>100/option>

 /select> 條
 /div>

 div class="col-md-9 paging">
 ul class="pagination">
 li>a href="#" >共 ${page.totlePages} 頁,${page.totleElements}
 條/a>/li>
 c:if test="${page.hasPrevious == false}">
 li class="disabled">a href="#" >首頁/a>/li>
 li class="disabled">a href="#" >上一頁/a>/li>
 /c:if>
 c:if test="${page.hasPrevious == true}">
 li>a
 href="?pageNum=1pageSize=${page.pageSize}${searchParams}" rel="external nofollow" >首頁/a>/li>
 li>a
 href="?pageNum=${page.prePage}pageSize=${page.pageSize}${searchParams}" rel="external nofollow" >上一頁/a>/li>
 /c:if>

 c:forEach var="i" begin="${page.begin}" end="${page.end}">
 c:choose>
 c:when test="${i == page.pageNum}">
 li class="active">a
 href="?pageNum=${i}pageSize=${page.pageSize}${searchParams}" rel="external nofollow" rel="external nofollow" >${i}/a>/li>
 /c:when>
 c:otherwise>
 li>a
 href="?pageNum=${i}pageSize=${page.pageSize}${searchParams}" rel="external nofollow" rel="external nofollow" >${i}/a>/li>
 /c:otherwise>
 /c:choose>
 /c:forEach>
 c:if test="${page.hasNext == true}">
 li>a
 href="?pageNum=${page.nextPage}pageSize=${page.pageSize}${searchParams}" rel="external nofollow" >下一頁/a>/li>
 li>a
 href="?pageNum=${page.totlePages}pageSize=${page.pageSize}${searchParams}" rel="external nofollow" >末頁/a>/li>
 /c:if>
 c:if test="${page.hasNext == false}">
 li class="disabled">a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >下一頁/a>/li>
 li class="disabled">a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >末頁/a>/li>
 /c:if>

 /ul>

 /div>
/div>
!-- 分頁信息結(jié)束 -->

Page.java (分頁信息類)

public class Page implements Serializable {

 private static final long serialVersionUID = 1L;
 
 public Page(int pageSize, int pageNum) {
 if(pageSize > 0 ){
 this.pageSize = pageSize;
 }
 if(pageNum > 0){
 this.pageNum = pageNum;
 }
 }

 /**
 * 初始化各個(gè)值
 */
 public void initValue(){
 // 計(jì)算總共有多少頁
 totlePages = (int)Math.ceil(totleElements * 1.0 / pageSize);
 
 if(totlePages == 0){
 totlePages = 1;
 }
 
 // 頁碼矯正
 if(pageNum = 0){
 pageNum = 1;
 }
 if(pageNum > totlePages){
 pageNum = totlePages;
 }
 
 // 是否有上一頁和首頁
 if(pageNum > 1){
 hasPrevious = true;
 prePage = pageNum - 1;
 }
 
 // 是否有下一頁和尾頁
 if(totlePages > pageNum){
 hasNext = true;
 nextPage = pageNum + 1;
 }
 
 // 分頁頁碼開始數(shù)值
 begin = Math.max(1, pageNum - paginationSize/2);
 
 // 分頁頁碼結(jié)束數(shù)值
 end = Math.min(begin + (paginationSize - 1), totlePages);
 }
 
 /**
 * 分頁下標(biāo)最多顯示多少頁
 */
 private int paginationSize = 10;
 /**
 * 頁碼開始
 */
 private int begin = 1;
 /**
 * 頁碼結(jié)束
 */
 private int end = 1;
 /**
 * 每頁顯示多少條
 */
 private int pageSize = 15;
 /**
 * 當(dāng)前頁碼
 */
 private int pageNum = 1;
 /**
 * 是否有下一頁
 */
 private boolean hasNext = false;
 /**
 * 是否有上一頁
 */
 private boolean hasPrevious = false;
 /**
 * 下一頁的頁碼
 */
 private int nextPage;
 /**
 * 上一頁的頁碼
 */
 private int prePage;
 /**
 * 總頁數(shù)
 */
 private int totlePages = 1;
 /**
 * 總條數(shù)
 */
 private int totleElements = 0;
 
 public static int maxNum = 999999;

 public int getPaginationSize() {
 return paginationSize;
 }
 public void setPaginationSize(int paginationSize) {
 this.paginationSize = paginationSize;
 }
 public int getBegin() {
 return begin;
 }
 public void setBegin(int begin) {
 this.begin = begin;
 }
 public int getEnd() {
 return end;
 }
 public void setEnd(int end) {
 this.end = end;
 }
 public int getPageSize() {
 return pageSize;
 }
 public void setPageSize(int pageSize) {
 this.pageSize = pageSize;
 }
 public int getPageNum() {
 return pageNum;
 }
 public void setPageNum(int pageNum) {
 this.pageNum = pageNum;
 }
 public boolean isHasNext() {
 return hasNext;
 }
 public void setHasNext(boolean hasNext) {
 this.hasNext = hasNext;
 }
 public boolean isHasPrevious() {
 return hasPrevious;
 }
 public void setHasPrevious(boolean hasPrevious) {
 this.hasPrevious = hasPrevious;
 }
 public int getNextPage() {
 return nextPage;
 }
 public void setNextPage(int nextPage) {
 this.nextPage = nextPage;
 }
 public int getPrePage() {
 return prePage;
 }
 public void setPrePage(int prePage) {
 this.prePage = prePage;
 }
 public int getTotlePages() {
 return totlePages;
 }
 public void setTotlePages(int totlePages) {
 this.totlePages = totlePages;
 }
 public int getTotleElements() {
 return totleElements;
 }
 public void setTotleElements(int totleElements) {
 this.totleElements = totleElements;
 // 知道總條數(shù)之后,初始化一下其它值
 initValue();
 }
 
 public static void main(String[] args) {
 System.out.println(Math.min(1, 2));
 }
 
 /**
 * 從第幾條開始查詢
 * @return
 */
 public int getStartNum(){
 return (pageNum -1) * pageSize + 1;
 }
 
 /**
 * 到第幾條結(jié)束
 * @return
 */
 public int getEndNum(){
 return pageNum * pageSize;
 }
}

PageUtil.java (分頁輔助類)

public class PageUtil implements Serializable {

 private static final long serialVersionUID = 1L;
 
 /**
 * 獲取目標(biāo)頁碼
 * @return
 */
 public static int getTargetPage(ServletRequest request){
 
 int pageNum = 0;
 
 String pageNumStr = request.getParameter("pageNum");
 
 if(StringUtils.isNotBlank(pageNumStr)){
 try{
 pageNum = Integer.valueOf(pageNumStr);
 }catch(Exception e){
 pageNum = 0;
 }
 }
 
 return pageNum;
 }
 
 /**
 * 獲取每頁條數(shù)
 * @return
 */
 public static int getPageSize(ServletRequest request){
 
 int pageSize = 0;
 
 String pageSizeStr = request.getParameter("pageSize");
 
 if(StringUtils.isNotBlank(pageSizeStr)){
 try{
 pageSize = Integer.valueOf(pageSizeStr);
 }catch(Exception e){
 pageSize = 0;
 }
 }
 
 return pageSize;
 }
 
 /**
 * 將Map中的查詢條件,加上前綴,以拼接
 * @param map
 * @param prefix 每個(gè)參數(shù)的前綴
 * @return
 */
 public static String encodeParameterStringWithPrefix(MapString,Object> map, String prefix){
 
 if(null == map || map.isEmpty()){
 return "";
 }
 
 StringBuffer sb = new StringBuffer();
 
 IteratorMap.EntryString,Object>> entries = map.entrySet().iterator();
 
 while (entries.hasNext()) {
 
 if(StringUtils.isNotEmpty(sb.toString())){
 sb.append("");
 }
 
 Map.EntryString,Object> entry = entries.next();
 
 sb.append(prefix);
 sb.append(entry.getKey());
 sb.append("=");
 sb.append(entry.getValue());
 
 } 
 
 return sb.toString();
 
 }

}

jsp頁面中查詢條件參數(shù)編寫示例如下:

!-- 查詢條件 -->
div class="col-md-10 search">

 form class="form-inline" action="${ctx }/vasadmin/user/money/list"
 method="get">
 div class="form-group">
 input type="text" class="form-control input-sm"
 name="search_userId" value="${param.search_userId }"
 placeholder="用戶ID"
 onkeyup="this.value=this.value.replace(/\D/g,'')"
 onafterpaste="this.value=this.value.replace(/\D/g,'')">
 /div>
 div class="form-group">
 input type="text" class="form-control input-sm"
 name="search_minMoney" value="${param.search_minMoney }"
 placeholder="最小余額"
 onkeyup="this.value=this.value.replace(/\D/g,'')"
 onafterpaste="this.value=this.value.replace(/\D/g,'')">
 /div>
 div class="form-group">
 input type="text" class="form-control input-sm"
 name="search_maxMoney" value="${param.search_maxMoney }"
 placeholder="最大余額"
 onkeyup="this.value=this.value.replace(/\D/g,'')"
 onafterpaste="this.value=this.value.replace(/\D/g,'')">
 /div>
 div class="form-group">
 button type="submit" class="btn btn-primary btn-sm">
 span class="glyphicon glyphicon-search">/span> 搜索
 /button>
 /div>
 /form>

/div>
!-- /查詢條件 -->

源碼下載地址:分頁源碼

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

您可能感興趣的文章:
  • JavaScript中條件語句的優(yōu)化技巧總結(jié)
  • 如何利用JavaScript編寫更好的條件語句詳解
  • 詳解寫好JS條件語句的5條守則
  • 分享5個(gè)小技巧讓你寫出更好的 JavaScript 條件語句
  • JavaScript中的條件判斷語句使用詳解
  • JScript中的條件注釋詳解
  • Javascript基礎(chǔ)教程之if條件語句
  • javascript里的條件判斷
  • 淺談JS如何寫出漂亮的條件表達(dá)式

標(biāo)簽:黃石 內(nèi)江 銅川 貸款邀約 廣州 樂山 大連 南京

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《JSP實(shí)現(xiàn)帶查詢條件的通用分頁組件》,本文關(guān)鍵詞  JSP,實(shí)現(xiàn),帶,查詢,條件,的,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《JSP實(shí)現(xiàn)帶查詢條件的通用分頁組件》相關(guān)的同類信息!
  • 本頁收集關(guān)于JSP實(shí)現(xiàn)帶查詢條件的通用分頁組件的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章