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第一课
Feb 27 Javascript
XRegExp 0.2: Now With Named Capture
Nov 30 Javascript
js 模拟实现类似c#下的hashtable的简单功能代码
Jan 24 Javascript
JS实现字体选色板实例代码
Nov 20 Javascript
利用Bootstrap实现表格复选框checkbox全选
Dec 21 Javascript
JavaScript输入框字数实时统计更新
Jun 17 Javascript
Bootstrap 模态框(Modal)带参数传值实例
Aug 20 Javascript
AngularJS中下拉框的基本用法示例
Oct 11 Javascript
vue路由跳转传参数的方法
May 06 Javascript
JavaScript使用canvas绘制随机验证码
Feb 17 Javascript
js 获取扫码枪输入数据的方法
Jun 10 Javascript
vue中echarts图表大小适应窗口大小且不需要刷新案例
Jul 19 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
php 静态变量的初始化
2009/11/15 PHP
解密ThinkPHP3.1.2版本之独立分组功能应用
2014/06/19 PHP
PHP数组与对象之间使用递归实现转换的方法
2015/06/24 PHP
Laravel学习教程之路由模块
2017/08/18 PHP
PHP实现找出链表中环的入口节点
2018/01/16 PHP
javascript Keycode对照表
2009/10/24 Javascript
jQuery checkbox全选/取消全选实现代码
2009/11/14 Javascript
JavaScript isArray()函数判断对象类型的种种方法
2010/10/11 Javascript
js substr、substring和slice使用说明小记
2011/09/15 Javascript
Google的跟踪代码 动态加载js代码方法应用
2012/11/12 Javascript
js实现黑色简易的滑动门网页tab选项卡效果
2015/08/31 Javascript
Javascript简单实现面向对象编程继承实例代码
2015/11/27 Javascript
基于node实现websocket协议
2016/04/25 Javascript
bootstrap使用validate实现简单校验功能
2016/12/02 Javascript
Bootstrap CSS布局之图像
2016/12/17 Javascript
JavaScript中数组Array方法详解
2017/02/27 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
Vue2.0 vue-source jsonp 跨域请求
2017/08/04 Javascript
React Native中的RefreshContorl下拉刷新使用
2017/10/09 Javascript
基于vue.js的分页插件详解
2017/11/27 Javascript
vue基础之事件简写、事件对象、冒泡、默认行为、键盘事件实例分析
2019/03/11 Javascript
jQuery表单校验插件validator使用方法详解
2020/02/18 jQuery
js实现页面图片消除效果
2020/03/24 Javascript
可用于监控 mysql Master Slave 状态的python代码
2013/02/10 Python
Python获取单个程序CPU使用情况趋势图
2015/03/10 Python
Python基于sftp及rsa密匙实现远程拷贝文件的方法
2016/09/21 Python
Python+selenium实现自动循环扔QQ邮箱漂流瓶
2018/05/29 Python
python写日志文件操作类与应用示例
2019/07/01 Python
pytest fixtures装饰器的使用和如何控制用例的执行顺序
2021/01/28 Python
Stella McCartney官网:成衣、包袋、香水、内衣、童装及Adidas系列
2018/12/20 全球购物
论文评语大全
2014/04/29 职场文书
心理健康日活动总结
2014/05/08 职场文书
重阳节慰问信
2015/02/15 职场文书
2015年语文教研组工作总结
2015/05/23 职场文书
高温慰问简报
2015/07/21 职场文书
家长会感言
2015/08/01 职场文书