欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

layui实现table加载的示例代码

程序员文章站 2023-09-07 14:37:54
js实现: layui.use(['table','form'], function() { $ = layui.jquery; table = layui....

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