layui实现table加载的示例代码


Posted in Javascript onAugust 14, 2018

js实现:

layui.use(['table','form'], function() {
$ = layui.jquery;
table = layui.table;
tableIns = initTable();
});
//加载列表
function initTable(){
// 执行渲染
tableIns = table.render({
id: 'idTest',
elem : '#deviceTable', // 指定原始表格元素选择器(推荐id选择器)
size: 'lg',
height : 'full-20', // 容器高度
url : '/csCloud-admin/deviceController/getDeviceList.do',
where: {
'orgId':$("#orgId").val(),
'coldNum':$("#coldNum").val(),
'devType':$("#devType").val(),
'isUsed':$("#isUsedId").val()
},
method : 'post',
cols : [ [ // 标题栏
{
field : 'rownum',
title : '序号',
width : 100,
sort : true
}, {
field : 'devNum',
title : '设备编号',
width : 200
}, {
field : 'devAlias',
title : '设备别名',
width : 100
}, {
field : 'devTypeVal',
title : '设备类型',
width : 100
}, {
field : 'devModel',
title : '设备型号',
width : 100
}, {
field : 'stateVal',
title : '设备状态',
width : 100
}, {
field : 'coldNum',
title : '冷库编号',
width : 100
}, {
field : 'orgName',
title : '所属机构',
width : 300
}, {
field : 'isUsedValue',
title : '状态',
width : 100
}, {
fixed : 'right',
width : 300,
align:'center',
toolbar : '#barDemo'
}
] ], // 设置表头
page : true,
limits : [ 10,30, 60, 90, 150, 300 ],
limit : 10
});
return tableIns;
}

jsp实现:

<div class="layui-fluid">
		<div class="layui-row">
			<div class="layui-col-lg12">
				<table id="deviceTable"></table>
			</div>
		</div>
	</div>

以上这篇layui实现table加载的示例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 字符串与数组转换函数[不用split与join]
Dec 13 Javascript
关于javascript中this关键字(翻译+自我理解)
Oct 20 Javascript
js或jquery实现页面打印可局部打印
Mar 27 Javascript
JS for循环中i++ 和 ++i的区别介绍
Jul 20 Javascript
浅析jsopn跨域请求原理及cors(跨域资源共享)的完美解决方法
Feb 06 Javascript
微信小程序日历效果
Dec 29 Javascript
手把手15分钟搭一个企业级脚手架
Sep 16 Javascript
在vue中动态添加class类进行显示隐藏实例
Nov 09 Javascript
es6中Promise 对象基本功能与用法实例分析
Feb 23 Javascript
JavaScript如何判断对象有某属性
Jul 03 Javascript
通过实例解析vuejs如何实现调试代码
Jul 16 Javascript
Kettle中使用JavaScrip调用jar包对文件内容进行MD5加密的操作方法
Sep 04 Javascript
layui点击导航栏刷新tab页的示例代码
Aug 14 #Javascript
JavaScript中toLocaleString()和toString()的区别实例分析
Aug 14 #Javascript
layer插件select选中默认值的方法
Aug 14 #Javascript
解决Layui选择全部,换页checkbox复选框重新勾选的问题方法
Aug 14 #Javascript
js中apply()和call()的区别与用法实例分析
Aug 14 #Javascript
JS通过位运算实现权限加解密
Aug 14 #Javascript
js中getter和setter用法实例分析
Aug 14 #Javascript
You might like
解决MySQL中文输出变成问号的问题
2008/06/05 PHP
Ubuntu server 11.04安装memcache及php使用memcache来存储session的方法
2016/05/31 PHP
Yii2增删改查之查询 where参数详细介绍
2016/08/08 PHP
PHP实现通过文本文件统计页面访问量功能示例
2019/02/13 PHP
js密码强度检测
2016/01/07 Javascript
AngularJS实现标签页的两种方式
2016/09/05 Javascript
bootstrap的3级菜单样式,支持母版页保留打开状态实现方法
2016/11/10 Javascript
浅谈Node.js轻量级Web框架Express4.x使用指南
2017/05/03 Javascript
Node.JS利用PhantomJs抓取网页入门教程
2017/05/19 Javascript
Vue + Vue-router 同名路由切换数据不更新的方法
2017/11/20 Javascript
一步快速解决微信小程序中textarea层级太高遮挡其他组件
2019/03/04 Javascript
微信小程序 wx:for遍历循环使用实例解析
2019/09/09 Javascript
vue通过v-html指令渲染的富文本无法修改样式的解决方案
2020/05/20 Javascript
[01:05:56]Liquid vs VP Supermajor决赛 BO 第二场 6.10
2018/07/04 DOTA
python复制与引用用法分析
2015/04/08 Python
Linux系统上Nginx+Python的web.py与Django框架环境
2015/12/25 Python
python实现多线程的两种方式
2016/05/22 Python
python清理子进程机制剖析
2017/11/23 Python
tensorflow创建变量以及根据名称查找变量
2018/03/10 Python
利用Python如何将数据写到CSV文件中
2018/06/05 Python
TensorFlow打印tensor值的实现方法
2018/07/27 Python
Python XML转Json之XML2Dict的使用方法
2019/01/15 Python
Python中函数参数匹配模型详解
2019/06/09 Python
解决pycharm下os.system执行命令返回有中文乱码的问题
2019/07/07 Python
Django 导出项目依赖库到 requirements.txt过程解析
2019/08/23 Python
python getpass模块用法及实例详解
2019/10/07 Python
Python龙贝格法求积分实例
2020/02/29 Python
利用HTML5的新特点实现图片文件异步上传
2014/05/29 HTML / CSS
新西兰第一的行李箱网站:luggage.co.nz
2019/07/22 全球购物
.net开发工程师面试题
2014/02/25 面试题
优秀班干部事迹材料
2014/01/26 职场文书
优秀共产党员先进事迹材料
2014/05/06 职场文书
教师作风整顿个人剖析材料
2014/10/10 职场文书
财政局党的群众路线教育实践活动剖析材料
2014/10/13 职场文书
酒店财务经理岗位职责
2015/04/08 职场文书
2016年度继续教育学习心得体会
2016/01/19 职场文书