layui 表格sort排序时,序号不打乱

作者 : MOOMOO 本文共1331个字,预计阅读时间需要4分钟 发布时间: 2022-05-3 共12人阅读

众所周知,layui的sort可以对数据进行排序,但是很多时候,为了导出或者打印效果,需要对序号不执行排序。

具体代码:

  1. <table class=”layui-table” id=”list” lay-filter=”list”></table>
  2. <script>
  3.     layui.use([‘table’,’form’,’element’], function() {
  4.         var table = layui.table,form = layui.form, $ = layui.jquery;
  5.         var tableIn = table.render({
  6.             id: ‘news’,
  7.             elem: ‘#list’,
  8.             url: ‘{:url(“index”)}’,
  9.             method: ‘post’,
  10.             page: true,
  11.             cols: [[
  12.                 {field: ‘key’, title: ‘序号’, align: ‘center’, width:”5%”},//不能使用fixed: true
  13.                 {field: ‘title’, title: ‘标题’,toolbar: ‘#info’,width:”10%”,  align: ‘left’ },
  14.                 {field: ‘url’, title: ‘url’,width:”10%”, align: ‘left’ },
  15.                 {field: ‘description’, title: ‘description’, align: ‘left’,sort: true},
  16.                 {field: ‘click’, title: ‘点击’, align: ‘center’, width:”5%”,sort: true},
  17.             ]],
  18.             limit: 45, //每页默认显示的数量
  19.         });
  20.         table.on(‘sort(list)’, function(obj) {//list与table中保持一致
  21.             var len = $(‘.layui-table tr’).length;
  22.             for(var i = 1;i<len;i++){
  23.                 $(‘.layui-table tr:eq(‘+i+’) td:first .layui-table-cell’).html(i);
  24.             }
  25.         });
  26.         table.reload(‘news’, {});//注意为news
  27.     });
  28. </script>

注意事项:

  • 要处理的field不能使用fixed,如要使用,需要重新对应class参数;
  • sort(list)和table.reload(‘news’, {})需要与实际保持一致;
1. 本站所有资源来源于用户上传和网络,仅作为演示数据,如有侵权请邮件联系站长!
2. 本站客服QQ:4387159,唯一购买官网:MooMoo.TOP!
3. 盗版,破解有损他人权益和违法作为,请各位会员支持正版!
MooMoo » layui 表格sort排序时,序号不打乱

常见问题FAQ

是否支持共享资源赚外快?
本站支持任何人上传资源,一经采用即可展示,客户下单既有80%的提成。
可以免费教技术吗?
大家可以加群进行探讨共同进步,重点问题管理员会进行解答。
我是小白要怎么学习?
加群后做到不耻下问,看文章学习演示就能成为大佬。

发表评论