layui表格表頭排序實現desc和asc的互換

        由於layui的動態表格有默認的排序,默認排序是當前頁面的數據排序,但是往往我們不需要單頁面的排序,我們需要訪問數據庫的那種,需要整體數據的排序,這是我們需要手動禁用前端自動排序功能。

//一下是layui處理自動排序的代碼塊,但是這裏有很多的不足的之處,我就直接在上面改了

//禁用前端自動排序,以便由服務端直接返回排序好的數據
table.render({
  elem: '#id'
   ,id:'idTest' //這裏給一個id值,下面的重新加載就是指的這個表格
  ,autoSort: false //禁用前端自動排序。注意:該參數爲 layui 2.4.4 新增
  //,… //其它參數省略
});
 
//監聽排序事件 
table.on('sort(test)', function(obj){ //這裏的test指的是layui的一個監聽事件lay-filter中的值
  console.log(obj.field); //當前排序的字段名
  console.log(obj.type); //當前排序類型:desc(降序)、asc(升序)、null(空對象,默認排序)
  console.log(this); //當前排序的 th 對象
 
  //儘管我們的 table 自帶排序功能,但並沒有請求服務端。
  //有些時候,你可能需要根據當前排序的字段,重新向服務端發送請求,從而實現服務端排序,如:
  table.reload('idTest', { //這裏的idTest就是我們上面給的加載的id值
    initSort: obj //記錄初始排序,如果不設的話,將無法標記表頭的排序狀態。
    ,where: { //請求參數(注意:這裏面的參數可任意定義,並非下面固定的格式)
      field: obj.field //排序字段
      ,order: obj.type //排序方式
    }
  });
  
  layer.msg('服務端排序。order by '+ obj.field + ' ' + obj.type);
});

        我們會發現,我們操作的時候layui會有默認的三種排序的方式null,asc,desc這樣你傳入後臺的時候就需要進行判斷,因爲我們排序只能有二種的desc和asc互換。

        這裏我是用的ssm框架,springmvc接受參數的時候由於是刷新的原來的表格,所有我們在默認的時候也是給的三個參數,page,limit,field,order,默認的時候是沒有後二個參數,我們需要判斷,當後二個參數不爲null的時候我們進行的就是表頭的字段排序,由於是三個參數值得互換,我們只需要二個參數的互換desc和asc。我的做法是在容器給一個參數num默認爲0,沒進行一次排序的時候num++,如果num%2==0,我們給的是order = "desc",如果num%2==1,我們給的是order="asc",這樣傳過來的是null的時候我們也可以進行的desc和asc的互換了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章