zoukankan      html  css  js  c++  java
  • 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', 80}
                ,{field: 'name', title: '名称',  288}
                ,{field: 'code', title: '编码', 168}
                ,{field: 'abbr', title: '简称',  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>
    
  • 相关阅读:
    Android VersionedGestureDetector手势事件
    Android drawBitmapMesh扭曲图像
    如何利用SVN合并代码
    Android 微信分享图文资料
    Android google map 两点之间的距离
    Android 监听ContentProvider的数据改变
    Android 自动朗读(TTS)
    Android ContentProvider的实现
    解决xcode升级之后安装的插件失效
    Android Studio 更换国内源下载依赖库
  • 原文地址:https://www.cnblogs.com/uniqid/p/11418666.html
Copyright © 2011-2022 走看看