layui问题之渲染数据表格时,仅出现10条数据的解决方法


Posted in Javascript onSeptember 12, 2019

一、问题

ajax获取服务端数据之后,要动态渲染table,但数据仅仅数显了10条,并没有渲染所有的数据。

二、经过

看一下表格需要的数据,0-9条的数据都自动有一个名为LAY_TABLE_INDEX的键值对,但10条及之后的数据都没有这个键值对。

很是纳闷,这个表格不带分页功能,应该不需要写limit对数据进行限制

table.render({
    elem: '#orderTable'
    ,height: 400
    ,cols: [[ //标题栏
     {field: 'status', title: "订单状态", width: 90}
     ,{field: 'orderSerialNumber', title: "订单编号", minWidth: 150}
     ,{field: 'logisticsSerialNumber', title: "物流串号", minWidth: 150}
     ,{field: 'curPos', title: "当前位置", minWidth: 150}
     ,{field: 'monitoringState', title: "监控状况", width: 140}
     ,{field: 'lastUpdated', title: "更新时间", width: 145, sort: true}
     ,{field: 'operating', title: "操作", minWidth: 220}
    ]]
    ,data: handleData
    ,even: true
   });

三、结果

看到官网上写:limit 参数(默认:10)是与你服务端限定的数据条数一致。就把limit加上去了,并且和服务端数据条数一致。

table.render({
    elem: '#orderTable'
    ,height: 400
    ,cols: [[ //标题栏
     {field: 'status', title: "订单状态", width: 90}
     ,{field: 'orderSerialNumber', title: "订单编号", minWidth: 150}
     ,{field: 'logisticsSerialNumber', title: "物流串号", minWidth: 150}
     ,{field: 'curPos', title: "当前位置", minWidth: 150}
     ,{field: 'monitoringState', title: "监控状况", width: 140}
     ,{field: 'lastUpdated', title: "更新时间", width: 145, sort: true}
     ,{field: 'operating', title: "操作", minWidth: 220}
    ]]
    ,data: handleData
    ,even: true
    ,limit: limit //显示的数量
   });

注:handleData是渲染表格时,表格需要的数据

以上这篇layui问题之渲染数据表格时,仅出现10条数据的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在第一个input框内输入内容.textarea自动得到第一个文件框的值的javascript代码
Apr 20 Javascript
JavaScript 类的定义和引用 JavaScript高级培训 自定义对象
Apr 27 Javascript
用js模拟JQuery的show与hide动画函数代码
Sep 20 Javascript
zTree插件之多选下拉菜单实例代码
Nov 06 Javascript
js 限制input只能输入数字、字母和汉字等等
Dec 18 Javascript
jquery实现的一个文章自定义分段显示功能
May 23 Javascript
Javascript非构造函数的继承
Apr 27 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 Javascript
浅谈javascript中关于日期和时间的基础知识
Jul 13 Javascript
angularjs2 ng2 密码隐藏显示的实例代码
Aug 01 Javascript
微信小程序网络层封装的实现(promise, 登录锁)
May 08 Javascript
jQuery实现数字华容道小游戏(实例代码)
Jan 16 jQuery
解决layui表格内文本超出隐藏的问题
Sep 12 #Javascript
微信小程序获取用户信息及手机号(后端TP5.0)
Sep 12 #Javascript
JS计算斐波拉切代码实例
Sep 12 #Javascript
VUE项目初建和常见问题总结
Sep 12 #Javascript
TypeScript中使用getElementXXX()的示例代码
Sep 12 #Javascript
深入浅析vue中cross-env的使用
Sep 12 #Javascript
layui form表单提交之后重新加载数据表格的方法
Sep 11 #Javascript
You might like
用户的详细注册和判断
2006/10/09 PHP
如何使用PHP往windows中添加用户
2006/12/06 PHP
使用php发送有附件的电子邮件-(PHPMailer使用的实例分析)
2013/04/26 PHP
php操作redis缓存方法分享
2015/06/03 PHP
PHP获取当前URL路径的处理方法(适用于多条件筛选列表)
2017/02/10 PHP
Yii2.0实现生成二维码功能实例
2017/10/24 PHP
PHP判断当前使用的是什么浏览器(推荐)
2019/10/27 PHP
js网页中的(运行代码)功能实现思路
2013/02/04 Javascript
JavaScript字符串对象fromCharCode方法入门实例(用于把Unicode值转换为字符串)
2014/10/17 Javascript
javascript使用正则表达式检测IP地址
2014/12/03 Javascript
JavaScript生成随机字符串的方法
2015/03/19 Javascript
js实现仿Discuz文本框弹出层效果
2015/08/13 Javascript
跟我学习javascript的prototype使用注意事项
2015/11/17 Javascript
webpack2.0配置postcss-loader的方法
2017/08/17 Javascript
Node做中转服务器转发接口
2017/10/18 Javascript
浅谈Vue 数据响应式原理
2018/05/07 Javascript
浅谈针对Vue相同路由不同参数的刷新问题
2018/09/29 Javascript
Vue实现移动端页面切换效果【推荐】
2018/11/13 Javascript
ES6 class的应用实例分析
2019/06/27 Javascript
Python中的ceil()方法使用教程
2015/05/14 Python
Python工程师面试题 与Python基础语法相关
2016/01/14 Python
同时安装Python2 & Python3 cmd下版本自由选择的方法
2017/12/09 Python
python 函数内部修改外部变量的方法
2018/12/18 Python
Pandas_cum累积计算和rolling滚动计算的用法详解
2019/07/04 Python
通过实例了解Python str()和repr()的区别
2020/01/17 Python
基于Tensorflow使用CPU而不用GPU问题的解决
2020/02/07 Python
如何使用python-opencv批量生成带噪点噪线的数字验证码
2020/12/21 Python
pytorch 中forward 的用法与解释说明
2021/02/26 Python
微信小程序实现可实时改变转速的css3旋转动画实例代码
2018/09/11 HTML / CSS
阿里云:Aliyun.com
2017/02/15 全球购物
羽毛球比赛策划方案
2014/06/13 职场文书
合同纠纷调解书
2015/05/20 职场文书
辩护词格式
2015/05/22 职场文书
人与自然的观后感
2015/06/18 职场文书
创业计划书之青年旅馆
2019/09/23 职场文书
多表查询、事务、DCL
2021/04/05 MySQL