zoukankan      html  css  js  c++  java
  • JQuery Easyui/TopJUI 基本树形表格的创建

    <table data-toggle="topjui-treegrid"
           data-options="id:'menuTg',
            idField:'id',
            treeField:'text',
            url:remoteHost+'/system/codeItem/getListByCodeSetIdAndLevelId?codeSetId=0&levelId=0',
            expandUrl:remoteHost+'/system/codeItem/getListByPid?pid={id}'">
        <thead>
        <tr>
            <th data-options="field:'uuid',title:'UUID',checkbox:true"></th>
            <th data-options="field:'text',title:'名称'"></th>
            <th data-options="field:'codeSetId',title:'体系代码'"></th>
            <th data-options="field:'id',title:'编号'"></th>
            <th data-options="field:'pid',title:'父级编号'"></th>
        </tr>
        </thead>
    </table>
    
    
    <!-- 表格工具栏开始 -->
    <div id="menuTg-toolbar" class="topjui-toolbar"
         data-options="grid:{
               type:'treegrid',
               id:'menuTg',
               parentIdField:'pid'
           }">
            <a href="javascript:void(0)"
           data-toggle="topjui-menubutton"
           data-options="method:'expandAll',
           extend: '#menuTg-toolbar',
           btnCls:'topjui-btn-blue'">展开全部</a>
        <a href="javascript:void(0)"
           data-toggle="topjui-menubutton"
           data-options="method:'collapseAll',
           extend: '#menuTg-toolbar',
           btnCls:'topjui-btn-blue'">折叠全部</a>
    </div>
    <!-- 表格工具栏结束 -->
    

      

    效果展示
           页面默认展示
     
     
     点击展示全部效果

     
    注意:这是一级一级的打开,点击一次打开一级
    点击折叠效果(一次性全部折叠。)
     
    纯HTML代码,展示折叠方法都封装好了,可以直接调用。
     
     
       EasyUI中文网:http://www.jeasyui.cn
      TopJUI前端框架:http://www.topjui.com
      TopJUI交流社区:http://ask.topjui.com
  • 相关阅读:
    Python的运算符
    RabbitMQ 的配置文件
    安装新版本的rabbitmq
    Ubuntu 16.04 安装rabbitmq
    Python Web 版本tailf, grep
    解决pycharm问题:module 'pip' has no attribute 'main'
    Python argparse
    Ansible 并行和异步
    cef相关
    浏览器透明设置例子,qt5.6才支持
  • 原文地址:https://www.cnblogs.com/xvpindex/p/10964079.html
Copyright © 2011-2022 走看看