layui 给数据表格加序号的方法


Posted in Javascript onAugust 20, 2018

1,第一种需求,只给当前页加序号

(1),给你的数据加上 templet属性

,cols: [[
 {field:'tourPlayerId', width:80, title: 'ID1', sort: true,fixed: 'left',}
 ,{field:'zizeng', width:80, title: '排名',fixed: 'left',templet:'#zizeng'}

(2),在table的下面加上:

<script type="text/html" id="zizeng">
 {{d.LAY_TABLE_INDEX+1}}
</script>

这样的话 下一页里面的排序不会连着上一页的,只会重新从1开始排序

layui 给数据表格加序号的方法

2,第二种方法,包括分页的数据也加上序号

加上type属性,

layui 给数据表格加序号的方法

设定列类型。可选值有:normal(常规列,无需设定)、checkbox(复选框列)、space(空列)、numbers(序号列)。注意:该参数为 layui 2.2.0 新增。而如果是之前的版本,复选框列采用 checkbox: true、空列采用 space: true

所以你这里只需要用到type:'numbers'就可以了,

效果如下:

layui 给数据表格加序号的方法

以上这篇layui 给数据表格加序号的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery 实现表格颜色交替变化鼠标移过颜色变化实例
Aug 28 Javascript
JS+CSS实现模仿浏览器网页字符查找功能的方法
Feb 26 Javascript
完美实现仿QQ空间评论回复特效
May 06 Javascript
浅谈js 闭包引起的内存泄露问题
Jun 22 Javascript
JavaScript 对象字面量讲解
Jun 06 Javascript
vue2里面ref的具体使用方法
Oct 27 Javascript
JS基于贪心算法解决背包问题示例
Nov 27 Javascript
利用JS测试目标网站的打开响应速度
Dec 01 Javascript
基于vue实现网站前台的权限管理(前后端分离实践)
Jan 13 Javascript
JS实现动态生成html table表格的方法分析
Jul 11 Javascript
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
Jul 20 Javascript
使用Vue实现一个树组件的示例
Nov 06 Javascript
解决LayUI表单获取不到data的问题
Aug 20 #Javascript
Layui数据表格之获取表格中所有的数据方法
Aug 20 #Javascript
解决layui上传文件提示上传异常,实际文件已经上传成功的问题
Aug 19 #Javascript
解决layui中table异步数据请求不支持自定义返回数据格式的问题
Aug 19 #Javascript
Vue常用指令详解分析
Aug 19 #Javascript
使用layui 渲染table数据表格的实例代码
Aug 19 #Javascript
layui获取选中行数据的实例讲解
Aug 19 #Javascript
You might like
解析CI的AJAX分页 另类实现方法
2013/06/27 PHP
CI框架在CLI下执行占用内存过大问题的解决方法
2014/06/17 PHP
自编函数解决pathinfo()函数处理中文问题
2014/11/03 PHP
简单理解PHP的面向对象编程方式
2016/05/17 PHP
无需数据库在线投票调查php代码
2016/07/20 PHP
PHP运行模式汇总
2016/11/06 PHP
PHP自定义函数实现数组比较功能示例
2017/10/19 PHP
关于php支持的协议与封装协议总结(推荐)
2017/11/17 PHP
jquery中常用的SET和GET
2009/01/13 Javascript
javaScript array(数组)使用字符串作为数组下标的方法
2013/11/19 Javascript
使用jquery animate创建平滑滚动效果(可以是到顶部、到底部或指定地方)
2014/05/27 Javascript
JavaScript中判断整数的多种方法总结
2014/11/08 Javascript
jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()
2015/08/09 Javascript
jQuery使用deferreds串行多个ajax请求
2016/08/22 Javascript
深入浅出ES6之let和const命令
2016/08/25 Javascript
基于JS实现翻书效果的页面切换样式
2017/02/16 Javascript
js与jQuery实现获取table中的数据并拼成json字符串操作示例
2018/07/12 jQuery
jquery获取img的src值实例介绍
2019/01/16 jQuery
对layui初始化列表的CheckBox属性详解
2019/09/13 Javascript
js数组的基本使用总结
2021/01/18 Javascript
Python模块学习 re 正则表达式
2011/05/19 Python
Python操作CouchDB数据库简单示例
2015/03/10 Python
Python字符串、元组、列表、字典互相转换的方法
2016/01/23 Python
python编码最佳实践之总结
2016/02/14 Python
Python 3.6 -win64环境安装PIL模块的教程
2019/06/20 Python
postman模拟访问具有Session的post请求方法
2019/07/15 Python
python 表格打印代码实例解析
2019/10/12 Python
Python 实现Numpy中找出array中最大值所对应的行和列
2019/11/26 Python
申报职称专业技术个人的自我评价
2013/12/12 职场文书
社区春季防火方案
2014/06/02 职场文书
总经理岗位职责
2015/02/04 职场文书
2016年元旦致辞
2015/08/01 职场文书
golang json数组拼接的实例
2021/04/28 Golang
面试分析分布式架构Redis热点key大Value解决方案
2022/03/13 Redis
疑《守望先锋2》A测截图泄露 或将推出新模式、新界面
2022/04/03 其他游戏
Python selenium绕过webdriver监测执行javascript
2022/04/12 Python