layui树形表格支持非异步和异步加载
layui树形表格支持非异步和异步加载。
仓库地址:https://gitee.com/uniqid/
使用示例如下:
<div class="uui-admin-common-body uui-bg-white">
<table id="list" class="layui-table uui-admin-table" lay-filter="list"></table>
</div> <script type="text/html" id="toolbarList">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" lay-event="expandAll">展开全部</button>
<button class="layui-btn layui-btn-sm" lay-event="expandOne">展开一层</button>
<button class="layui-btn layui-btn-sm" lay-event="foldAll">折叠全部</button>
<button class="layui-btn layui-btn-sm" lay-event="foldOne">折叠一层</button>
</div>
</script> <script>
layui.config({
base: '/uui/treetable-lay/module/'
}).extend({
treetable: 'treetable-lay/treetable'
}).use(['treetable'], function () {
var treetable = layui.treetable; treetable.render({
treeColIndex: 1,
treeSpid: 0,
treeIdKey: 'code',
treePidKey: 'pcode',
treeIsLeafKey: 'isleaf',
treeDefaultClose: false,
treeLinkage: false,
treeNodeAsync: true,
elem: '#list',
toolbar: '#toolbarList',
url: '/admin/regions',
method: 'post',
parseData: parseData,
cols: [[
{field: 'id', title: 'ID', width:80}
,{field: 'name', title: '名称', width: 288}
,{field: 'code', title: '编码', width:168}
,{field: 'abbr', title: '简称', width: 100}
,{field: 'created_at', title: '添加时间'}
]]
}); treetable.on('toolbar(list)', function(obj){
if(obj.event == 'expandOne'){
treetable.expandOne('#list');
} else if(obj.event == 'expandAll'){
treetable.expandAll('#list');
} else if(obj.event == 'foldOne'){
treetable.foldOne('#list');
} else {
treetable.foldAll('#list');
}
});
});
</script>
layui树形表格支持非异步和异步加载的更多相关文章
- 180807-Quick-Task 动态脚本支持框架之Groovy脚本加载执行
Quick-Task 动态脚本支持框架之Groovy脚本加载执行 上一篇简答说了如何判断有任务动态添加.删除或更新,归于一点就是监听文件的变化,判断目录下的Groovy文件是否有新增删除和改变,从而判 ...
- 180729-Quick-Task 动态脚本支持框架之任务动态加载
Quick-Task 动态脚本支持框架之任务动态加载 前面几篇博文分别介绍了整个项目的基本架构,使用说明,以及整体框架的设计与实现初稿,接下来则进入更细节的实现篇,将整个工程中核心实现捞出来,从为什么 ...
- D3树状图异步按需加载数据
D3.js这个绘图工具,功能强大不必多说,完全一个Data Driven Document的绘图工具,用户可以按照自己的数据以及希望实现的图形,随心所欲的绘图. 图形绘制,D3默认采用的是异步加载,但 ...
- jeecgboot-vue3笔记(八)——treeSelect树形选择组件的使用(一次性加载)
使用效果 前端代码 定义interface export interface TreeDataItem { value: string; key: string; title?: string; sl ...
- layui的几个简单使用(简单弹窗,加载效果,移除加载效果)
1.加载效果和移除加载效果 function layuiLoading(msg){ layui.use(['layer', 'form'], function(){ index = layer.loa ...
- mpvue支持小程序的分包加载
目录 clone mpvue-quickstart 模板 分包体验 现有项目的分包改造 这个功能可以说是让我们这些用 mpvue 的等的很焦灼,眼看着项目的大小一天天地逼近 2M,mpvue 还不能很 ...
- 001_Chrome 76支持原生HTML 图片懒加载Lazy loading
Table Of Content 什么是懒加载? 语法参数及使用方式? 有哪些特点? 与js有关的实践 什么是懒加载? 技术背景 Web应用需要经常向后台服务器请求资源(通过查询数据库,是非常耗时耗资 ...
- js实现所有异步请求全部加载完毕后,loading效果消失
在实际开发中,一定有情况是这样的,一个页面我们有多个地方请求了ajax,在这种情况下,我们要实现数据没来之前出现我们炫酷的loading效果,而且要等到所有的ajax都请求完毕后,才让我们的loadi ...
- LayUI中实现上级下拉框动态加载下级下拉框js
js代码: var form = layui.form, layer = layui.layer; form.on("select(上级)", function(data){ va ...
随机推荐
- [CSP-S模拟测试]:简单的序列(DP)
题目描述 从前有个括号序列$s$,满足$|s|=m$.你需要统计括号序列对$(p,q)$的数量. 其中$(p,q)$满足$|p|+|s|+|q|=n$,且$p+s+q$是一个合法的括号序列. 输入格式 ...
- mysq访问方式
mysql -h10.81.32.196 -P5152 -Dns_map_data_new -uwangyuchuan_r -p3DLg15rhSsm0O7Nsselect uid,name from ...
- Java数据结构与算法(1):线性表
线性表是一种简单的数据类型,它是具有相同类型的n个数据元素组成的有限序列.形如如A0,A1,...,An-1.大小为0的表为空表,称Ai后继Ai-1,并称Ai-1前驱Ai. printList打印出表 ...
- Java 静态static 关键字作用
静态的方法1.可以通过类名打点访问2.不能使用this关键字3.不能访问非静态的属性和方法 /* * 静态的方法: * 1.属于类的方法,可以通过类名打点访问 * 2.方法中不能使用this关键字 * ...
- CentOS6.5/7安装配置Samba
CentOS6.5安装配置Samba 本文的场景是虚拟机运行CentOS6.,本机是Win7,现欲把CentOS上的一个文件夹共享出来,Win的机器可以读写. Samba与window连接需要使用Ne ...
- Hypermesh中弹簧单元设置
1D >> springs 单元类型 CBUSH1D 单元属性 PBUSH1D
- qbzt day5 上午
动态规划 递推 递归 记忆化搜索 斐波那契数列 1.用其他已经计算好的结果计算自己的结果(递推) 2.用自己的值计算别人的值(考虑对之后的项做出的贡献) cin >> n; f[]= ...
- 【转】mackbook wifi卡死未响应的问题
原文:http://tieba.baidu.com/p/6140144143?traceid= 1. wifi未响应了,紧急处理法:打开活动监视器,搜索airportd,结束掉进程 2. 彻底解决办法 ...
- Java接口继承
Java中接口可以继承接口,并且可以多继承.
- 阶段1 语言基础+高级_1-3-Java语言高级_06-File类与IO流_09 序列化流_2_对象的序列化流_ObjectOutputStream
创建person对象.生成构造方法全参和无参.getter和setter 抛出异常:没有序列化异常 接口的源码 啥都没有.就起到一个标记的作用 用二进制存的