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 相关文章推荐
JsRender for index循环索引用法详解
Oct 31 Javascript
JavaScript日期类型的一些用法介绍
Mar 02 Javascript
使用jquery实现仿百度自动补全特效
Jul 23 Javascript
JavaScript小技巧整理篇(非常全)
Jan 26 Javascript
关于JS Lodop打印插件打印Bootstrap样式错乱问题的解决方案
Dec 23 Javascript
Node.js中.pfx后缀文件的处理方法
Mar 10 Javascript
JS+HTML5 FileReader对象用法示例
Apr 07 Javascript
微信小程序实现锚点定位楼层跳跃的实例
May 18 Javascript
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
Jan 16 Javascript
微信小程序在线客服自动回复功能(基于node)
Jul 03 Javascript
AngularJS动态生成select下拉框的方法实例
Nov 17 Javascript
vue 组件基础知识总结
Jan 26 Vue.js
解决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
smtp邮件发送一例
2006/10/09 PHP
laravel 5 实现模板主题功能
2015/03/02 PHP
一个加密JavaScript的开源工具PACKER2.0.2
2006/11/04 Javascript
javascript SocialHistory 检查访问者是否访问过某站点
2008/08/02 Javascript
jquery 表单下所有元素的隐藏
2009/07/25 Javascript
jquery实现的一个导航滚动效果具体代码
2013/05/27 Javascript
基于OO的动画附加插件,可以实现弹跳、渐隐等动画效果 分享
2013/06/24 Javascript
JS文本框追加多个下拉框的值的简单实例
2013/07/12 Javascript
查找iframe里元素的方法可传参
2013/09/11 Javascript
Google 地图获取API Key详细教程
2016/08/06 Javascript
js遍历json对象所有key及根据动态key获取值的方法(必看)
2017/03/09 Javascript
静态页面实现 include 引入公用代码的示例
2017/09/25 Javascript
VueJs组件之父子通讯的方式
2018/05/06 Javascript
VeeValidate在vue项目里表单校验应用案例
2018/05/09 Javascript
微信小程序实现运动步数排行功能(可删除)
2018/07/05 Javascript
详解如何在vue项目中使用eslint+prettier格式化代码
2018/11/10 Javascript
微信小程序使用map组件实现检索(定位位置)周边的POI功能示例
2019/01/23 Javascript
基于vue手写tree插件的那点事儿
2019/08/20 Javascript
JavaScript实现单图片上传并预览功能
2019/09/30 Javascript
通过C++学习Python
2015/01/20 Python
python中将两组数据放在一起按照某一固定顺序shuffle的实例
2019/07/15 Python
python使用建议技巧分享(三)
2020/08/18 Python
python实现简单文件读写函数
2021/02/25 Python
Html5 localStorage入门教程
2018/04/26 HTML / CSS
整理HTML5中表单的常用属性及新属性
2016/02/19 HTML / CSS
浅析HTML5 Landmark
2020/09/11 HTML / CSS
美国在线咖啡、茶和餐厅供应商:LollicupStore
2018/05/04 全球购物
介绍一下Java中的static关键字
2012/05/12 面试题
大学生思想汇报范文
2013/12/31 职场文书
开学寄语大全
2014/04/08 职场文书
建筑安全生产目标责任书
2014/07/23 职场文书
小学教师自我评价
2015/03/04 职场文书
给朋友的道歉短信
2015/05/12 职场文书
预备党员转正意见
2015/06/01 职场文书
地道战观后感300字
2015/06/04 职场文书
排查MySQL生产环境索引没有效果
2022/04/11 MySQL