layui的table渲染cols的标题错乱问题,number转成string

在表格的列中,运用了一下字典查出来的key值做列名,方便不定量统计用,结果发现后台传的值为 0,1,2,3...,到前台也是,但是在table.render了之后却发生了变化.

猜测在添加序号的时候,默认第一列序号占据了 0(int) 列,然后将自己的变量的第一个0,给覆盖成了3 .

试图删除序号列之后又发现第一个变成了 2 ,猜想因为是数字列,被layui给处理过了.

于是测试,使用反撇号,加入cols中, >>> ,问题解决,从 0 开始排序,但是因为部分浏览器不支持 ` ,所以改成了 字符串 的处理方法,

效果>

总结:问题大概是table的cols渲染,标题改变 >可能是int 类型 需要转成 string 类型 .

所见不多,待后续遇到更多问题再处理.

原文地址:https://www.cnblogs.com/bigod/p/11791996.html

时间: 2024-08-30 15:32:05

layui的table渲染cols的标题错乱问题,number转成string的相关文章

layui教程---table

layui.config({ base: "${ctx}/static/js/" }).use(['form', 'layer', 'jquery', 'common','element', 'table', 'laytpl'], function () { $ = layui.$; var $ = layui.$, form = layui.form, common = layui.common, laydate = layui.laydate, element = layui.el

layui的table使用

不多bb,直接上代码 html的代码: <link rel="stylesheet" href="../../static/layui/css/layui.css"> <script src="../../static/layui/layui.js"></script> <script src="../../static/js/jquery.js"></script>

layui的table在reload之后工具栏按钮失效的问题解决方案

layui的table在使用了toolbar工具栏后,刷新表格,工具栏的按钮会失效,原因是表格重新加载后,没有绑定工具栏按钮的触发事件,因此只需要在表格初始化完毕之后和刷新表格完毕后重新绑定一下所有按钮的绑定事件就可以了,这里把事件处理集合到了一个方法中,请参照bindTableToolbarFunction,具体代码如下: 1. Html页面 <section class="layui-fluid"> <aside class="layui-card&qu

layui 数据table隐藏表头

$('.layui-table .layui-table-cell > span').css({'font-weight': 'bold'});//表头字体样式 /*$('th').css({'background-color': '#5792c6', 'color': '#fff','font-weight':'bold'}) 表头的样式 */ $('th').hide();//表头隐藏的样式 $('.layui-table-page').css('margin-top','40px');//

layui使用table.reload()后保持滚动条

使用table时有个特殊需要,改变table中的某一项时,再table展示内容较多需要滚动条时,由于后台需要运算结果,所以必须要table.reload加载数据,但是滚动条会被重置到0的位置. 网上有推荐的方法,实测后发现缺少一句代码,导致无法改动滚动条位置. 1 var $ = layui.$, 2 table = layui.table; 3 4 //在你需要重置表格的前面加上代码 5 6 var scrollTop=0; 7 var layuiTable = $('.layui-table

layui table 渲染完成后,怎样拿到表个里的所有数据

var url = layui.table.cache.test[index]["url"]; $("#show_pic").attr("src", url); 其中 test 是 table 的 id 原文地址:https://www.cnblogs.com/mentiantian/p/10218074.html

layui 框架 table插件 实现键盘快捷键 切换单元格编辑

最近使用layui的框架时,发现table插件不支持键盘快捷键切换单元格,花了点时间实现此功能. 分享给有需要的朋友们~~~ 1.支持 enter,上,下,右键 切换单元格,支持隐藏列跳过切换. 注:单元格必须开启了 edit:text 模式,才支持键盘切换. 使用方法:1.在需要启用此功能的页面中js代码段插入.2.在公用的js文件中插入即可.使用此方式js文件必须在页面加载完成后再加载,最迟加载,切记! 原文地址:https://www.cnblogs.com/zakary-zhen/p/1

element-ui中table渲染的快速用法

element-ui中对table数据的渲染有一些模板式的操作,基本按照模板渲染数据即可 基本模板样式如下 <el-table :data="studentData.rows" style="width: 100%" stripe :header-cell-style="{background:'#e1e4eb'}" > <el-table-column prop="studentName" label=&q

layui中table表格的操作列(删除,编辑)等按钮的操作

1 //编辑,删除,发布申请 2 table.on('tool(demo)', function(obj){ 3 var data = obj.data; 4 // console.log(data) 5 if(obj.event === 'check'){ 6 // console.log(data.id); 7 $('.textCon').val(""); 8 layer.open({ 9 title: '发布申请' 10 ,type: 1 11 ,maxmin:true 12 ,