zoukankan      html  css  js  c++  java
  • TreeGrid( 树形表格)

    本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使用方法,这个组件依赖于
    DataGrid(数据表格)组件

    一. 加载方式
    //建立一个 JSON 文件
    [{
    "id" : 1,
    "name" : "系统管理",
    "date" : "2015-05-10",
    "children" : [{
    "id" : 2,
    "name" : "主机信息",
    "date" : "2015-05-11"
    }]
    }, {
    "id" : 3,
    "name" : "会员管理",
    "date" : "2015-05-10",
    "children" : [{
    "id" : 4,
    "name" : "认证审核",
    "date" : "2015-05-11"
    }]
    }]
    //class 加载方式
    <table class="easyui-treegrid" style="380px;height:150px"
    data-options="url:'treegrid.json',idField:'id',treeField:'name'">
    <thead>
    <tr>
    <th data-options="field:'name',180">菜单名称</th>

    <th data-options="field:'date',180">创建时间</th>
    </tr>
    </thead>
    </table>
    //JS 加载方式
    <table id="box" style="380px;height:150px;"></table>
    $('#box').treegrid({
    url : 'treegrid.json',
    idField : 'id',
    treeField : 'name',
    columns : [[
    {
    title : '菜单名称',
    field : 'name',
    width : 180,
    },
    {
    title : '创建时间',
    field : 'date',
    width : 180,
    }
    ]],
    });

    二. 属性列表
    树形表格扩展自 datagrid(数据表格),树形表格新增的属性如下:

    方法和 DataGrid 一致,不在重复!略。

    三. 事件列表
    树形表格的事件扩展自 datagrid(数据表格),树形表格新增的时间如下:

    四. 方法列表
    很多方法都使用'id'命名参数,而'id'参数代表树节点的值

  • 相关阅读:
    eclipse workspace
    logcat and monkey
    git command
    Take Total Control of Internet Explorer with Advanced Hosting Interfaces
    #import 指令
    今天聊发兴致,写了一个 COM STEP BY STEP,结果。。。
    DECLARE_CLASSFACTORY_SINGLETON 宏
    对象微操
    宏定义缺失的解决
    读取地址本内容
  • 原文地址:https://www.cnblogs.com/qinsilandiao/p/5017946.html
Copyright © 2011-2022 走看看