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="width:380px;height:150px"
data-options="url:'treegrid.json',idField:'id',treeField:'name'">
<thead>
<tr>
<th data-options="field:'name',width:180">菜单名称</th>
<th data-options="field:'date',width:180">创建时间</th>
</tr>
</thead>
</table>
//JS 加载方式
<table id="box" style="width: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'参数代表树节点的值


TreeGrid( 树形表格)的更多相关文章
- 第二百二十八节,jQuery EasyUI,TreeGrid(树形表格)组件
jQuery EasyUI,TreeGrid(树形表格)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使 ...
- 【整理】treeGrid 树形表格
treeGrid 树形表格 https://fly.layui.com/extend/treeGrid/
- treegrid树形表格的完美运用
一 问题描述: 树形表格TreeGrid在日常项目中还是运用的比较多的,哪我们在项目中,应该怎么引入和使用 TreeGrid呢? 二 使用步骤 1.首先我们需要在项目中,引入TreeGrid组件 需 ...
- easyUI中treegrid组件构造树形表格(简单数据类型)+ssm后台
这几天做的项目要求用树形表格的形式展示一部分数据,于是就想到了使用easyUI的treegrid组件,但几经翻查各种资料,发现数据类型大多采取标准数据类型,即包含children元素的数据类型,小编查 ...
- Bootstrap treegrid 实现树形表格结构
前言 :最近的项目中需要实现树形表格功能,由于前端框架用的是bootstrap,但是bootstrapTable没有这个功能所以就找了一个前端的treegrid第三方组件进行了封装.现在把这个封装的组 ...
- ELement-UI之树形表格(treeTable&&treeGrid)
先上图来一波 支持无限层级,支持新增子级时自动打开父级,支持编辑时自动打开父级,执行操作时自带动画效果,支持初始化时设置全部打开或者关闭,支持一键展开与关闭丝滑般的无延迟 由于基于el-table扩展 ...
- ExtJS4.2学习(15)树形表格(转)
鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-27/185.html --------------- ...
- easyui源码翻译1.32--TreeGrid(树形表格)
前言 扩展自$.fn.datagrid.defaults.使用$.fn.treegrid.defaults重写默认值对象.下载该插件翻译源码 树形表格用于显示分层数据表格.它是基于数据表格.组合树控件 ...
- 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格
EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...
随机推荐
- python的exec、eval详解
exec exec语句用来执行储存在字符串或文件中的Python语句.例如,我们可以在运行时生成一个包含Python代码的字符串,然后使用exec语句执行这些语句.下面是一个简单的例子. exec ' ...
- Php OpenID
也许大家都有这样的经历与烦恼:当你为了使用某个网站的服务时(若你还没在该网站上注册过),你不得不先注册一个帐号.当你在一堆的网站上注册帐号后,你必需面临管理这些帐号的烦恼.也许你会这样考虑,不同网站注 ...
- centos 6.5网卡dhcp不能获得网关
环境:vmware +centos6.5 添加两个虚拟网卡.一个自动获取ip(用于上网-桥接) 一个手动(与主机通信用于ssh-NAT). 因为自已手动改了一下ifcfg-eth0里面的HWADDR ...
- jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中
jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...
- Windows下更改MySQL数据库的存储位置
在MySQL安装完成后,要修改数据库存储的位置,比如从安装目录下的C:\Program Files\MySQL\MySQL Server 5.0\Data文件夹转移到D:\mySQLData文件夹. ...
- CentOS 添加/绑定 IP
美国VPS的独立IP相对于国内而言,是非常的便宜的.比如有些美国VPS,买5个独立IP才三美元左右一个月.当我们购买了多个独立IP时,如果你不想再联系客服而漫长的等待,那就自己手动配置吧. 一.进入/ ...
- GitHub与VS2013完成项目管理
https://github.com 程序员应该去注册一个账号的网站 1.创建一个仓库 登录你的github网站:找到新建一个仓库的入口 一些基本信息填写完毕后,点击创建,即可拥有一个仓库 2. 让V ...
- 基于verilog的FPGA编程经验总结(XILINX ISE工具)
1.用ISE仿真的时候.所用变量一定要初始化. ISE默认初始量为"XXXXX", 而Quarters是默认为"00000"的, 其实实际上, 下到FPGA里后 ...
- 转:基于开源项目OpenCV的人脸识别Demo版整理(不仅可以识别人脸,还可以识别眼睛鼻子嘴等)【模式识别中的翘楚】
文章来自于:http://blog.renren.com/share/246648717/8171467499 基于开源项目OpenCV的人脸识别Demo版整理(不仅可以识别人脸,还可以识别眼睛鼻子嘴 ...
- 测试Beetle.Redis+Web Api
在Web Api里用Beetle.Redis调用Redis服务端的TIME命令返回一个json格式,然后客户端是用的HttpTest4Net做的测试: CPU:I7-3770 内存:4G+4G 硬盘: ...