关于layui中tablle 渲染数据后 sort排序问题

时间:2023-03-09 03:17:44
关于layui中tablle 渲染数据后 sort排序问题

最近在使用easyweb框架做后台管理,案例可见https://gitee.com/whvse/EasyWeb。

其中遇到了 sort排序问题,

html代码:<table class="layui-table" id="userList-table" lay-filter="userList-table"></table>

js代码: layui.use(['form', 'table', 'util', 'config', 'admin'], function () {
var form = layui.form;
var table = layui.table;
var config = layui.config;
var layer = layui.layer;
var util = layui.util;
var admin = layui.admin;
var access_token=config.getToken().access_token; // 渲染表格
table.render({
id:'userList-table',
elem: '#userList-table',
url: config.base_server + 'gameend/userList',
method: 'GET',
where: {
access_token: access_token
},
page: true,
limit: 100,
cols: [[
{type: 'numbers'},
{field: 'username', title: '用户名'},
{field: 'nickname', sort: false, title: '昵称'},
{field: 'points', sort: true, title: '积分'},
{field: 'drawnum', sort: false, title: '抽奖次数'},
{field: 'invitenum', sort: true, title: '邀请好友数'},
{field: 'ip', sort: false, title: 'ip注册地'},
{field: 'createtime', sort: false, title: '注册时间'},
{field: 'status', sort: false, templet: '#userList-tpl-state', title: '状态'},
{align: 'center', toolbar: '#userList-table-bar', title: '操作'},
{align: 'center', toolbar: '#userInfo-table-bar', title: '查看详情'},
]],
done: function(res, page, count){
//如果是异步请求数据方式,res即为你接口返回的信息。
//如果是直接赋值的方式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度 $("[data-field='points']").each(function(){
$(this).addClass("points");
});
$("[data-field='drawnum']").each(function(){
$(this).addClass("drawnum");
});
$("[data-field='10']").each(function(){
$(this).addClass("ckxq");
}) }
}); var type="";
table.on('sort(userList-table)', function(obj) { //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"
// console.log(obj.field); //当前排序的字段名
//console.log(obj.type); //当前排序类型:desc(降序)、asc(升序)、null(空对象,默认排序)
//console.log(this); //当前排序的 th 对象 //type 0 积分降序 1积分升序 2邀请数降序 3邀请数升序
//
if(obj.field=="points"){ //积分排序
if(obj.type=="desc"){ //降序 type=0
type=0;
}else if(obj.type=="asc"){ //升序 type=1
type=1;
}else if(obj.type==null){
type="";
}
} if(obj.field=="invitenum"){ //积分排序
if(obj.type=="desc"){ //降序 type=0
type=2;
}else if(obj.type=="asc"){ //升序 type=1
type=3;
}else if(obj.type==null){
type="";
}
} //console.log(type);
      table.reload('userList-table', {
       initSort: obj, //记录初始排序,如果不设的话,将无法标记表头的排序状态。 layui 2.1.1 新增参数
       where: {
       access_token: access_token,
     type:type
    }});
  
      });

  });

参考文档:http://www.cnblogs.com/Ofsoul/p/9633397.html