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 相关文章推荐
在Z-Blog中运行代码[html][/html](纯JS版)
Mar 25 Javascript
jquery中对表单的基本操作代码
Jul 29 Javascript
jquery等宽输出文字插件使用介绍
Sep 18 Javascript
jquery实现滑动图片自己测试的例子
Nov 05 Javascript
jQuery+ajax实现实用的点赞插件代码
Jul 06 Javascript
详解JavaScript基础知识(JSON、Function对象、原型、引用类型)
Jan 16 Javascript
vue-quill-editor富文本编辑器简单使用方法
Sep 21 Javascript
Layui点击图片弹框预览的实现方法
Sep 16 Javascript
vue实现简单瀑布流布局
May 28 Javascript
JavaScript设计模式--简单工厂模式实例分析【XHR工厂案例】
May 23 Javascript
JS常见错误(Error)及处理方案详解
Jul 02 Javascript
vue-router中hash模式与history模式的区别
Jun 23 Vue.js
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
菜鸟修复电子管记
2021/03/02 无线电
为什么那些咖啡爱好者大多看不上连锁咖啡店?
2021/03/06 咖啡文化
PHP中执行cmd命令的方法
2014/10/11 PHP
微信公众号支付之坑:调用支付jsapi缺少参数 timeStamp等错误解决方法
2016/01/12 PHP
php die()与exit()的区别实例详解
2016/12/03 PHP
PHP常用日期加减计算方法实例小结
2018/07/31 PHP
基于jquery的模态div层弹出效果
2010/08/21 Javascript
使用jQuery+HttpHandler+xml模拟一个三级联动的例子
2011/08/09 Javascript
flash+jQuery实现可关闭及重复播放的压顶广告
2015/04/15 Javascript
javascript中eval解析JSON字符串
2016/02/27 Javascript
利用jQuery插件imgAreaSelect实现获得选择域的图像信息
2016/12/02 Javascript
JavaScript获取短信验证码(周期性)
2016/12/29 Javascript
微信小程序 this和that详解及简单实例
2017/02/13 Javascript
微信小程序返回多级页面的实现方法
2017/10/27 Javascript
基于vue-router 多级路由redirect 重定向的问题
2018/09/03 Javascript
详解Webpack-dev-server的proxy用法
2018/09/08 Javascript
vue实现简易图片左右旋转,上一张,下一张组件案例
2020/07/31 Javascript
Python获取电脑硬件信息及状态的实现方法
2014/08/29 Python
Python实现命令行通讯录实例教程
2016/08/18 Python
python语言中with as的用法使用详解
2018/02/23 Python
python DataFrame 修改列的顺序实例
2018/04/10 Python
Python爬虫包BeautifulSoup实例(三)
2018/06/17 Python
python3 http提交json参数并获取返回值的方法
2018/12/19 Python
python实现猜数字游戏
2020/03/25 Python
python爬虫爬取监控教务系统的思路详解
2020/01/08 Python
Python 列表的清空方式
2020/01/13 Python
Python模块/包/库安装的六种方法及区别
2020/02/24 Python
Python如何使用队列方式实现多线程爬虫
2020/05/12 Python
python模块如何查看
2020/06/16 Python
英国街头品牌:Bee Inspired Clothing
2018/02/12 全球购物
幼儿教师求职信
2014/05/24 职场文书
养成教育经验材料
2014/05/26 职场文书
合同权益转让协议书模板
2014/11/18 职场文书
房屋租赁意向书范本
2015/05/09 职场文书
初中物理教学反思
2016/02/19 职场文书
Python实现视频自动打码的示例代码
2022/04/08 Python