如何動態更改layui.reload()的cols


layui一般的數據表格的表頭都是固定的,一般都是像下面的寫法:

table.render({
    elem: '#demo'
    ,height: 312
    ,url: '/demo/table/user/' //數據接口
    ,page: true //開啟分頁
    ,cols: [[ //表頭
      {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
      ,{field: 'username', title: '用戶名', width:80}
      ,{field: 'sex', title: '性別', width:80, sort: true}
      ,{field: 'city', title: '城市', width:80} 
      ,{field: 'sign', title: '簽名', width: 177}
      ,{field: 'experience', title: '積分', width: 80, sort: true}
      ,{field: 'score', title: '評分', width: 80, sort: true}
      ,{field: 'classify', title: '職業', width: 80}
      ,{field: 'wealth', title: '財富', width: 135, sort: true}
    ]]
  });
  
});

但是根據項目的需要,表頭可能需要刷新更改數據,這個時候我們就應該將reload函數里面cols的col變成變量

obj.reload({
        where: opt,
        cols: [
            newcol
            ],
        page: {
            curr: 1 //重新從第 1 頁開始
            }
                    });

至於看到這里了,表頭如何改變呢,樓主最開始看表頭是數組字符串想能不能用數組進行操作進行刪除和添加呢,經過了一個端午節的糾結發現並不太行

於是吃了一個粽子的樓主發現原來cols里面有一個屬性可以直接對表頭數據進行修改,賢心大大真的是十分貼心了

當hide屬性選擇true的時候就不可以進行顯示,當hide屬性選擇false的時候就能進行顯示。

table.render({
    elem: '#demo'
    ,height: 312
    ,url: '/demo/table/user/' //數據接口
    ,page: true //開啟分頁
    ,cols: [[ //表頭
      {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
      ,{field: 'username', title: '用戶名', width:80}
      ,{field: 'sex', title: '性別', width:80, sort: true}
      ,{field: 'city', title: '城市', width:80} 
      ,{field: 'sign', title: '簽名', width: 177}
      ,{field: 'experience', title: '積分', width: 80, sort: true}
      ,{field: 'score', title: '評分', width: 80, sort: true}
      ,{field: 'classify', title: '職業', width: 80}
      ,{field: 'wealth', title: '財富', width: 135, sort: true,hide:true}
    ]]
  });
  
});

此時財富就被隱藏掉了


免責聲明!

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



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