欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

layui 數(shù)據(jù)表格 點(diǎn)擊分頁按鈕 監(jiān)聽事件的實(shí)例

 更新時(shí)間:2019年09月02日 11:01:24   作者:z先生1025  
今天小編就為大家分享一篇layui 數(shù)據(jù)表格 點(diǎn)擊分頁按鈕 監(jiān)聽事件的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧

找了 很多 關(guān)于表格分頁 點(diǎn)擊事件 請(qǐng)求, table.render 并不支持監(jiān)聽點(diǎn)擊事件,所以我就把 table.render 和 laypage.render結(jié)合在一起

(我也不想寫分頁的,但是后臺(tái)講數(shù)據(jù)多 ,要加分頁,被逼無奈 ,想了一個(gè)方法)

先上圖

代碼

.html

<div>
  <table class="layui-hide" id="test" lay-filter="demo"></table>
  <div id="page"></div>
</div>

.js

//頁面第一次請(qǐng)求 默認(rèn) 1頁 10條
function dataLists(pageNum, numPerPage) {
    $.post(Url + 'pipei_dj/pagelist', {
      pageNum: pageNum, // 頁碼數(shù)
      numPerPage: numPerPage // 每頁條數(shù)
    }, function (data) {
      let datalist = JSON.parse(data)
      dataList(datalist) // 數(shù)據(jù)傳到 table組件
      page(datalist)   // 數(shù)據(jù)傳到 分頁組件
    })
  }
  dataLists(1, 10)

function page(data) {
    laypage.render({
      elem: 'page', //注意,這里的 page 是 ID,不用加 # 號(hào)
      count: data.totalCount, //數(shù)據(jù)總數(shù),從服務(wù)端得到
      limit: data.numPerPage, // 每頁條數(shù)
      limits: [10, 20, 30, 40, 50],
      layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
      jump: function (obj, first) {
        //console.log(obj)
        //obj包含了當(dāng)前分頁的所有參數(shù),比如:
        //console.log(obj.curr); //得到當(dāng)前頁,以便向服務(wù)端請(qǐng)求對(duì)應(yīng)頁的數(shù)據(jù)。
        //console.log(obj.limit); //得到每頁顯示的條數(shù)

        //首次不執(zhí)行
        if (!first) {
          //do something
          numpage(obj.curr, obj.limit) // 分頁點(diǎn)擊傳參 
        }
      }
    });
  }
	// 從新寫了 一個(gè)請(qǐng)求
  function numpage(pageNum, numPerPage) {
    $.post(Url + 'pipei_dj/pagelist', {
      pageNum: pageNum,
      numPerPage: numPerPage
    }, function (data) {
      let datalist = JSON.parse(data)
      dataList(datalist) // 傳到table組件
    })
  }

  // 表格渲染
  function dataList(data) {
    table.render({
      elem: '#test',
      cols: [
        [{
          title: '序號(hào)',
          type: "numbers"
        }, {
          field: 'id',
          title: 'id',
          hide: true
        }, {
          field: 'status',
          title: '狀態(tài)',
          hide: true
        }, {
          field: 'danjia',
          title: '單價(jià)(¥)'
        }, {
          field: 'createtime',
          title: '創(chuàng)建時(shí)間'
        }, {
          field: 'status',
          title: '狀態(tài)',
          toolbar: '#barstate'
        }, {
          title: '操作',
          toolbar: '#barDemo'
        }]
      ],
      data: data.dataList, // 數(shù)據(jù)
      limit: data.numPerPage, // 顯示的條數(shù)
      //page: true, // 開啟分頁
    });
  }

以上這篇layui 數(shù)據(jù)表格 點(diǎn)擊分頁按鈕 監(jiān)聽事件的實(shí)例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論