关于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
关于layui中tablle 渲染数据后 sort排序问题的更多相关文章
- Winfrom 中 ComboBox 绑定数据后设置选定项问题
在为 ComboBox 当定数据的时候,如果遇到界面显示需要用文本,而获取选定项的值时需要用数字,我们就很习惯使用 DataSource 来进行绑定. 例如以下代码: List<TextVal ...
- vue渲染数据后与owlCarousel轮播插件冲突,失效
主要原因:dom解析准备完成后,开始执行$(document).ready(); 而vue是在window.onload(页面加载完后才执行):所以会导致owlCarousel插件失效. 解决方案:数 ...
- Itext读取PDF模板文件渲染数据后创建新文件
Maven导入依赖 <properties> <itextpdf.version>5.5.0</itextpdf.version> <itext-asian. ...
- layui问题之渲染数据表格时,只显示10条数据
通过ajax请求的数据,console.log()有30条数据,实际上只显示10条, 原因是没有设置limit table.render({ elem: '#report-collection' , ...
- yii框架中获取添加数据后的id值
Yii::$app->db->createCommand()->insert('month4_user',['openid'=>$openid,'integ'=>0])- ...
- 有关ngui grid中去除一项后的排序问题
遇到这个问题,是在实现一个公告栏界面的时候,公告栏可以新增一条公告,也可以删除一条公告. 新增很简单,这里不做多的介绍: 关于删除,之前的代码是: GameObject go = is_parent. ...
- python从数据库取数据后写入excel 使用pandas.ExcelWriter设置单元格格式
用python从数据库中取到数据后,写入excel中做成自动报表,ExcelWrite默认的格式一般来说都比较丑,但workbook提供可以设置自定义格式,简单记录个demo,供初次使用者参考. 一. ...
- angular中关于自定义指令——repeat渲染完成后执行动作
业务中有时需要在异步获取数据并用ng-repeat遍历渲染完页面后执行某个操作,angular本身并没有提供监听ng-repeat渲染完成的指令,所以需要自己动手写.有经验的同学都应该知道,在ng-r ...
- Vue项目中v-for无法渲染数据
在Vue项目中,我们想要实现下面的布局效果 后端返回的数据格式如下,可以看出产品列表五张图的数据位于同一个数组中 而我的html结构如下: 我希望直接渲染左边一张大图,然后右边的四张小图通过v-for ...
随机推荐
- APP下载在微信无法打开 该如何处理
大家是不是经常会遇到微信内点击链接或扫描二维码无法打开指定网页的问题?只要你使用微信转发分享,相信你就一定会遇到,那么打不开的原因很简单了,就是被微信拦截了.这个问题我们只需要实现从微信内直接跳出到外 ...
- shutil
import shutil#功能是将db文件中的内容拷贝到haha这个文件中去,但是haha原有的内容会被清空#shutil.copyfileobj(open('db','r',encoding='u ...
- js中new函数后带括号和不带括号的区别
用new创建构造函数的实例时,通常情况下new 的构造函数后面需要带括号(譬如:new Parent()). 有些情况下new的构造函数后带括号和不带括号的情况一致,譬如: function Pare ...
- javascript中的add(1)(2)(3)(4)是怎么实现的
javascript中的add(1)(2)(3)(4)是怎么实现的?实现如下: var fn = function(a){ let sum = a; let tempFn = function(b){ ...
- 浅谈redis的HyperLogLog与布隆过滤器
首先,HyperLogLog与布隆过滤器都是针对大数据统计存储应用场景下的知名算法. HyperLogLog是在大数据的情况下关于数据基数的空间复杂度优化实现,布隆过滤器是在大数据情况下关于检索一个元 ...
- winfrom程序Datagridview列名问题
之前在做程序的时候,有遇到过这个问题: 无法将类型“string”隐式转换为“System.Windows.Forms.DataGridViewTextBoxColume"解决方法 解决办法 ...
- Oracle 使用序列实现自增列 及重置序列
序列是oracle用来生产一组等间隔的数值.序列是递增,而且连续的.oracle主键没有自增类型,所以一般使用序列产生的值作为某张表的主键,实现主键自增.序列的编号不是在插入记录的时候自动生成的,必须 ...
- idea开发maven项目热加载
JavaWeb项目,尤其是一些大型项目,在开发过程中,启动项目耗费的时间就不短.大大的拖慢了开发速度!在这分享一种不需要插件就能实现热加载的方法! 默认已经创建好一个Maven项目 点击此按钮 点击 ...
- python识别图片中的代码。
在看并发编程网的时候,有些示例代码是以图片的形式出现的,要是此时自己想复制下来的话,只能对着图片敲了,很不爽,于是搜了一下识别图片的网站,有! 把图片上传上去解析,下来txt文本,打开一看,大部分能解 ...
- 利用phpredis实现PHP操作Redis
redis在PHP中的基本使用案例 利用phpredis实现PHP操作Redis,需要进行redis.so的下载,添加 //利用Redis类进行操作 //实例化Redis类 $redis = new ...