解决layui表格排序与后台数据返回顺序不一致
一直想让“总计”的数据处在第一行,后台返回的结果中,总计是排在第一位的,但数据返回之后layui表格又重新排序一遍,因为是以升序排列,总计的总消费是最多的,导致“总计”排在了最后一位,与自己想要的排在首行不符处理方法:table.on('sort(tbdata)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filte...
一直想让“总计”的数据处在第一行,后台返回的结果中,总计是排在第一位的,但数据返回之后layui表格又重新排序一遍,因为是以升序排列,总计的总消费是最多的,导致“总计”排在了最后一位,与自己想要的排在首行不符
处理方法:
table.on('sort(tbdata)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"
table.reload('data-reload', {//'data-reload'为表格对应的id值
//initSort: obj //记录初始排序,如果不设的话,将无法标记表头的排序状态。 layui 2.1.1 新增参数//需删除或注释掉此属性,否则不会按照后台返回的顺序排列,layui依旧会重新排序
where: { //请求参数(注意:这里面的参数可任意定义,并非下面固定的格式)
field: obj.field //排序字段
,order: obj.type //排序方式
}
,url: 'xxxxxxxxxxxxxx'//后台执行的方法
,done:function(res,curr,count){
//执行到此后,可实现依照后台返回的顺序排列,但点击表格的排序小三角形之后,不会变黑,小三角形没有了颜色状态,一直是灰色的
var numval = $('.dataTopTable .layui-form').attr('lay-filter')//获取到表格的lay-filter属性,即LAY-table-2(每点击一次排序的小三角,此属性后面的数字会加1)
numzu = numval.split("-");//将字符串转为数组
num = numzu[2];//获取最后的数字
$('.laytable-cell-'+num+'-'+obj.field+'>span:last()').attr('lay-sort',obj.type);//给小三角加颜色状态
}
});
});
==================================================
排序中删除initSort: obj之后已经实现了按照后台返回顺序排序,但小三角形没了颜色状态,一直是灰色的
执行完done之后,给小三角形加了颜色状态
【改变小三角形的颜色状态只是给对应的div中第2个span标签加了lay-sort="desc/asc"属性】
========================
实现按照后台返回顺序排序可参考:https://fly.layui.com/jie/33735/
更多推荐
所有评论(0)