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>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM