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 相关文章推荐
js 表单验证方法(实用)
Apr 28 Javascript
JavaScript 闭包深入理解(closure)
May 27 Javascript
jQuery validate 中文API 附validate.js中文api手册
Jul 31 Javascript
js计算精度问题小结
Apr 22 Javascript
javascript自动生成包含数字与字符的随机字符串
Feb 09 Javascript
JavaScript编写连连看小游戏
Jul 07 Javascript
Jquery简单分页实现方法
Jul 24 Javascript
JS实现的车标图片提示效果代码
Oct 10 Javascript
jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)
May 16 Javascript
jQuery ajax MD5实现用户注册即时验证功能
Oct 11 Javascript
JS实现鼠标移上去显示图片或微信二维码
Dec 14 Javascript
微信小程序的动画效果详解
Jan 18 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 mvc开发模式的感想
2011/06/28 PHP
php文字水印和php图片水印实现代码(二种加水印方法)
2013/12/25 PHP
详解PHP中instanceof关键字及instanceof关键字有什么作用
2015/11/05 PHP
YII2框架使用控制台命令的方法分析
2020/03/18 PHP
JavaScript 判断判断某个对象是Object还是一个Array
2010/01/28 Javascript
jquery中dom操作和事件的实例学习 下拉框应用
2011/12/01 Javascript
如何通过javascript操作web控件的自定义属性
2013/11/25 Javascript
angularJS提交表单(form)
2015/02/09 Javascript
深入了解JavaScript中的Symbol的使用方法
2015/07/28 Javascript
常见JS验证脚本汇总
2015/12/01 Javascript
Node.js操作mysql数据库增删改查
2016/03/30 Javascript
JS中frameset框架弹出层实例代码
2016/04/01 Javascript
jQuery.Uploadify插件实现带进度条的批量上传功能
2016/06/08 Javascript
利用javascript如何随机生成一定位数的密码
2017/09/22 Javascript
vue在使用ECharts时的异步更新和数据加载详解
2017/11/22 Javascript
express express-session的使用小结
2018/12/12 Javascript
JS数组中对象去重操作示例
2019/06/04 Javascript
vue中实现回车键登录功能
2020/02/19 Javascript
Element Cascader 级联选择器的使用示例
2020/07/27 Javascript
Vue项目打包编译优化方案
2020/09/16 Javascript
js实现扫雷源代码
2020/11/27 Javascript
Python编程中运用闭包时所需要注意的一些地方
2015/05/02 Python
Python+Wordpress制作小说站
2017/04/14 Python
Python实现求一个集合所有子集的示例
2018/05/04 Python
使用Python实现一个栈判断括号是否平衡
2018/08/23 Python
几个适合python初学者的简单小程序,看完受益匪浅!(推荐)
2019/04/16 Python
CentOS7下安装python3.6.8的教程详解
2020/01/03 Python
tensorflow实现在函数中用tf.Print输出中间值
2020/01/21 Python
浅谈Keras的Sequential与PyTorch的Sequential的区别
2020/06/17 Python
如何使用python记录室友的抖音在线时间
2020/06/29 Python
Selenium之模拟登录铁路12306的示例代码
2020/07/31 Python
复古服装:RetroStage
2019/05/10 全球购物
《小小竹排画中游》教学反思
2014/02/26 职场文书
保险公司演讲稿
2014/09/02 职场文书
井冈山红色之旅感想
2014/10/07 职场文书
解析mybatis-plus中的resultMap简单使用
2021/11/23 Java/Android