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のローディングを実現した例コードです。小編集は皆さんに全部の内容を共有しています。参考にしてもらいたいです。どうぞよろしくお願いします。