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 form表单提交插件asp.net后台中文解码
Jun 12 Javascript
javascript时区函数介绍
Sep 14 Javascript
jquery 实现两Select 标签项互调示例代码
Sep 25 Javascript
JavaScript中的small()方法使用详解
Jun 08 Javascript
jQuery实现向下滑出的二级菜单效果实例
Aug 22 Javascript
Angular客户端请求Rest服务跨域问题的解决方法
Sep 19 Javascript
Vue.js最佳实践(五招助你成为vuejs大师)
May 04 Javascript
Js中使用正则表达式验证输入是否有特殊字符
Sep 07 Javascript
自己动手封装一个React Native多级联动
Sep 19 Javascript
详解@angular/cli 改变默认启动端口两种方式
Nov 29 Javascript
Angular利用HTTP POST下载流文件的步骤记录
Jul 26 Javascript
Vue.js中v-for指令的用法介绍
Mar 13 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
用PHP的ob_start();控制您的浏览器cache!
2006/11/25 PHP
使用PHP socke 向指定页面提交数据
2008/07/23 PHP
php数据库抽象层 PDO
2011/05/07 PHP
PHP的简易冒泡法代码分享
2012/08/28 PHP
PHP中filter函数校验数据的方法详解
2015/07/31 PHP
PHP函数import_request_variables()用法分析
2016/04/02 PHP
js文本框输入点回车触发确定兼容IE、FF等
2013/11/19 Javascript
javascript使用正则表达式检测IP地址
2014/12/03 Javascript
jQuery实现带有洗牌效果的动画分页实例
2015/08/31 Javascript
javascript基本算法汇总
2016/03/09 Javascript
Windows 系统下设置Nodejs NPM全局路径
2016/04/26 NodeJs
详解springmvc 接收json对象的两种方式
2016/12/06 Javascript
浅谈js-FCC算法Friendly Date Ranges(详解)
2017/04/10 Javascript
使用JavaScript根据图片获取条形码的方法
2017/07/04 Javascript
浅谈react前后端同构渲染
2017/09/20 Javascript
详解Typescript 内置的模块导入兼容方式
2020/05/31 Javascript
浅谈JavaScript窗体Window.ShowModalDialog使用
2020/07/22 Javascript
Python统计单词出现的次数
2018/04/04 Python
解决python opencv无法显示图片的问题
2018/10/28 Python
python实现dijkstra最短路由算法
2019/01/17 Python
pymongo中group by的操作方法教程
2019/03/22 Python
pytorch 在sequential中使用view来reshape的例子
2019/08/20 Python
TensorFlow tf.nn.max_pool实现池化操作方式
2020/01/04 Python
pytorch下大型数据集(大型图片)的导入方式
2020/01/08 Python
keras实现VGG16 CIFAR10数据集方式
2020/07/07 Python
Blue Nile蓝色尼罗河香港官网:世界最大在线钻石珠宝销售商
2020/05/07 全球购物
可以在一个PHP文件里面include另外一个PHP文件两次吗
2015/05/22 面试题
北承题目(C++)
2012/05/16 面试题
GC是什么?为什么要有GC?
2013/12/08 面试题
英语专业学生个人求职信范文
2014/01/06 职场文书
高中打架检讨书
2014/02/13 职场文书
讲座主持词
2014/03/20 职场文书
《沉香救母》教学反思
2014/04/19 职场文书
试用期转正后的自我评价
2014/09/21 职场文书
不尊敬老师检讨书范文
2014/11/19 职场文书
搞笑老公保证书
2015/02/26 职场文书