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 相关文章推荐
javascript 最常用的10个自定义函数[推荐]
Dec 26 Javascript
javascript 定义新对象方法
Feb 20 Javascript
IE中jquery.form中ajax提交没反应解决方法分享
Sep 11 Javascript
了解Javascript的模块化开发
Mar 02 Javascript
自己编写的支持Ajax验证的JS表单验证插件
May 15 Javascript
window.onload与$(document).ready()的区别分析
May 30 Javascript
深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性
Dec 16 Javascript
form+iframe解决跨域上传文件的方法
Nov 18 Javascript
vue 注册组件的使用详解
May 05 Javascript
Vue 样式绑定的实现方法
Jan 15 Javascript
js中怎么判断两个字符串相等的实例
Jan 17 Javascript
原生js实现html手机端城市列表索引选择城市
Jun 24 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将mysql数据库整库导出生成sql文件的具体实现
2014/01/08 PHP
PHP简单的MVC框架实现方法
2015/12/01 PHP
Laravel中前端js上传图片到七牛云的示例代码
2017/09/04 PHP
P3P Header解决Cookie跨域的问题
2013/03/12 Javascript
js复制到剪切板的实例方法
2013/06/28 Javascript
PHP使用方法重载实现动态创建属性的get和set方法
2014/11/17 Javascript
Javascript简单改变表单元素背景的方法
2015/07/15 Javascript
JavaScript制作简单的日历效果
2016/03/10 Javascript
JavaScript实现提交模式窗口后刷新父窗口数据的方法
2017/06/16 Javascript
JavaScript基础进阶之数组方法总结(推荐)
2017/09/04 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
2018/08/09 jQuery
JS中验证整数和小数的正则表达式
2018/10/08 Javascript
angular 实现下拉列表组件的示例代码
2019/03/09 Javascript
js中console在一行内打印字符串和对象的方法
2019/09/10 Javascript
Python中的CURL PycURL使用例子
2014/06/01 Python
深入理解Python 代码优化详解
2014/10/27 Python
python实现支持目录FTP上传下载文件的方法
2015/06/03 Python
python实现在字符串中查找子字符串的方法
2015/07/11 Python
关于python2 csv写入空白行的问题
2018/06/22 Python
Django添加sitemap的方法示例
2018/08/06 Python
详解python3中的真值测试
2018/08/13 Python
python基于三阶贝塞尔曲线的数据平滑算法
2019/12/27 Python
Python如何基于rsa模块实现非对称加密与解密
2020/01/03 Python
解决python运行启动报错问题
2020/06/01 Python
html5 学习简单的拾色器
2010/09/03 HTML / CSS
ALDO美国官网:加拿大女鞋品牌
2018/12/28 全球购物
物业保安主管岗位职责
2013/12/25 职场文书
大学生个人事迹材料
2014/01/21 职场文书
护理中职生求职信范文
2014/02/24 职场文书
餐饮商业计划书范文
2014/04/29 职场文书
事业单位年度考核评语
2014/12/31 职场文书
研究生毕业论文导师评语
2014/12/31 职场文书
创业计划书之溜冰场
2019/10/25 职场文书
SQL Server连接查询的实用教程
2021/04/07 SQL Server
Django实现聊天机器人
2021/05/31 Python
Java获取字符串编码格式实现思路
2022/09/23 Java/Android