真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

在SSM框架下如何使用laypage和ajax實現(xiàn)分頁和數(shù)據(jù)交互的方法-創(chuàng)新互聯(lián)

小編給大家分享一下在SSM框架下如何使用laypage和ajax實現(xiàn)分頁和數(shù)據(jù)交互的方法,希望大家閱讀完這篇文章之后都有所收獲,下面讓我們一起去探討吧!

為千陽等地區(qū)用戶提供了全套網(wǎng)頁設(shè)計制作服務(wù),及千陽網(wǎng)站建設(shè)行業(yè)解決方案。主營業(yè)務(wù)為成都網(wǎng)站設(shè)計、成都網(wǎng)站制作、千陽網(wǎng)站設(shè)計,以傳統(tǒng)方式定制建設(shè)網(wǎng)站,并提供域名空間備案等一條龍服務(wù),秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務(wù)。我們深信只要達到每一位用戶的要求,就會得到認可,從而選擇與我們長期合作。這樣,我們也可以走得更遠!

layui,一款前端框架,提供了豐富的組件和模板,layui提供的簡約后臺管理模板,對于后端學(xué)習(xí)者來說是個不錯的福音。這里記錄在SSM框架下使用layui的分頁組件laypage。(官網(wǎng)開發(fā)文檔)

環(huán)境 Spring+SpringMVC+Mybatis , jquery-3.1.0.min.js , mysql-connector-java-5.1.34

前端代碼主要參考的是layui官網(wǎng)給定的代碼,加載layui.css和layui.js;除此之外,介于接下來用ajax與后臺進行數(shù)據(jù)交互,因此這里也需要加載jquery的文件,我這里加載的是jquery-3.1.0-min.js。

主要代碼如下:

 //定義分頁 var url = "http://localhost:8080/HRM/"; $(document).ready(function(){   layui.use(['form','laypage', 'layer'], function(){   var laypage = layui.laypage,layer = layui.layer;   laypage({   cont: 'demo', //跟頁面前面div的id一樣   pages: ${endPage} , //總頁數(shù)   groups: 5 , //連續(xù)顯示分頁數(shù)   jump: function(obj, first){   //得到了當(dāng)前頁,用于向服務(wù)端請求對應(yīng)數(shù)據(jù)   var curr = obj.curr -1;   var self = this;   $.ajax({    //這里省略了ajax數(shù)據(jù)交互   });  }); });

后端采用SpirngMVC和Mybatis進行數(shù)據(jù)處理。

創(chuàng)建Dao接口

List selectPageInfoByDel(@Param("start") int start); //獲取頁面數(shù)據(jù)
int countNumber(); //記錄總的條數(shù)

編寫Mapper.xml

這里主要用到了mysql的limit,limit從下標(biāo)0開始,limit0,8表示的是從下標(biāo)0開始,查詢8條數(shù)據(jù)。


  select id,c_id,job,number,salary,more_salary,date from jobinfo where is_del = 1 order by id DESC limit #{start,jdbcType=INTEGER},8


  select count(*) from jobinfo where is_del =1

創(chuàng)建一個Page的pojo類

public class Page implements Serializable {
 private static final long serialVersionUID = 337297181251071639L;
 private Integer page;//當(dāng)前頁
 private Integer rows;//頁大小
 private Integer totalRecord;// 總記錄數(shù)
 private Integer firstPage; //首頁
 private Integer endPage; //末頁 
 private List list;//頁面數(shù)據(jù)列表
 //這里省略的get和set的方法
}

創(chuàng)建Service接口

//查看分頁的信息
public List selectPageInfo(int page);
//查看所有信息的總數(shù)
int getCount();

創(chuàng)建Service的實現(xiàn)類impl

//這里省略了Dao的實例化,只顯示service接口的實現(xiàn)方法
public List selectPageInfo(int page) {
 int rows = 8; //一頁顯示8條數(shù)據(jù)
 int start = page*rows; //這里表示數(shù)據(jù)庫從第幾條數(shù)據(jù)開始查詢(limit從下標(biāo)0開始)
 return jobDao.selectPageInfoByDel(start);
}
public int getCount() {
 return jobDao.countNumber();
}

編寫Controller

@RequestMapping("page")
public @ResponseBody Page selectPageInfo(HttpServletRequest request, Model model,@RequestParam("start") int start){
  List list= jobinfoService.selectPageInfo(start);
 Page pageInfo = new Page();
 int count = jobinfoService.getCount(); //獲取總數(shù)
 int endPage = 0;
 //8條數(shù)據(jù)為一頁
 if(jobinfoService.getCount()%8==0){
  endPage = jobinfoService.getCount()/8;
 }else{
  endPage = jobinfoService.getCount()/8 +1 ;
 } 
 pageInfo.setPage(start+1);
 pageInfo.setTotalRecord(count);
 pageInfo.setList(list);
 pageInfo.setRows(8);
 pageInfo.setFirstPage(1);
 pageInfo.setEndPage(endPage);
 return pageInfo;
}

運行結(jié)果

在SSM框架下如何使用laypage和ajax實現(xiàn)分頁和數(shù)據(jù)交互的方法

事實上,整體功能的實現(xiàn)在頁面與后臺用ajax傳遞數(shù)據(jù)那一塊花費了一下時間,因為第一次接觸到layui,也漸漸感受到了layui與傳統(tǒng)ajax數(shù)據(jù)傳遞的不同,layui對方法進行了封裝,因此用ajax傳數(shù)據(jù)的時候也需依于框架進行。

看完了這篇文章,相信你對“在SSM框架下如何使用laypage和ajax實現(xiàn)分頁和數(shù)據(jù)交互的方法”有了一定的了解,如果想了解更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計公司行業(yè)資訊頻道,感謝各位的閱讀!

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。


網(wǎng)站欄目:在SSM框架下如何使用laypage和ajax實現(xiàn)分頁和數(shù)據(jù)交互的方法-創(chuàng)新互聯(lián)
本文鏈接:http://weahome.cn/article/coipds.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部