当前位置: 移动技术网 > IT编程>开发语言>JavaScript > layui实现table加载的示例代码

layui实现table加载的示例代码

2018年08月18日  | 移动技术网IT编程  | 我要评论

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加载的示例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持移动技术网。

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网