springmvc結合ajax的分頁功能


var itemCount;//符合查找條件的商品總頁數,分頁參考
var pageIndex = 0;//當前頁,默認為0
var pageSize = 8;//每頁顯示個數為8

//按條件查找用戶
function searchItem(pageIndex,pageSize){

//清空要append的目的位置
$('#searchItem').empty();

$('.ajax_page').empty();


var url = "${ctx}/crms/orderCenter/findItemList";
$.post(url,{"pageIndex":0,"pageSize":8},function(data){
  var items = data.itemList;
  var appendItem = '';
  itemCount = Math.ceil(data.itemCount/8);
  //查詢結果所有的商品
  $.each(items,function(i,result){
    appendItem = "<tr class='w790 h55'><td class='w75 text-center bgc_fafafa'>"
    + "<input type='text' class='num_iid' value='"+result.numIid+"'>"
    + "<div onclick='addNumIid("+result.numIid+")' class='w20 h20 bgc_e0e6ef margin0_auto b_radius5 GXK'></div>"
    + "</td><td class='w620 bgc_fafafa'><img class='w54 h45 m_t5 m_l10 m_r20 f_l' src='"+result.url+"'><p class='w400 h55 lh55 f_l'>"+result.title+"</p></td>"
    + "<td class='w78 text-center bgc_fafafa'>"+result.price+"</td></tr>";
    $('#searchItem').append(appendItem);
  });
  //分頁
  var page = '<div id="userPage" align="center" ><font size="2">共'+itemCount+'頁</font><font size="2">第'
      +(pageIndex+1)+'頁</font> <a href="javascript:void" onclick="goToFirstPage()" id="aFirstPage" >首頁</a>'
      +'<a href="javascript:void" onclick="goToPrePage()" id="aPrePage">上一頁</a>'
      +'<a href="javascript:void" onclick="goToNextPage()" id="aNextPage">下一頁</a>'
      +'<a href="javascript:void" onclick="goToEndPage()" id="aEndPage">尾頁</a>';
      page+='</div>';
    $('.ajax_page').append(page);
},'json');
};


//首頁
function goToFirstPage(){
  pageIndex = 0;
  searchItem(pageIndex,pageSize);
}


//前一頁
function goToPrePage(){
  pageIndex -= 1;
  pageIndex = pageIndex >= 0 ? pageIndex : 0;
  searchItem(pageIndex,pageSize);
}


//后一頁
function goToNextPage(){
  if(pageIndex + 1 < itemCount){
    pageIndex += 1;
  }
  searchItem(pageIndex,pageSize);
}
//尾頁
function goToEndPage(){
  pageIndex = itemCount -1;
  searchItem(pageIndex,pageSize);
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM