Tree( 树) 组件[1]
本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖
动)和 Droppable(放置)组件。
一. 加载方式
//class 加载方式
<ul class="easyui-tree">
<li>
<span>系统管理</span>
<ul>
<li>
<span>主机信息</span>
<ul>
<li>版本信息</li>
<li>数据库信息</li>
</ul>
</li>
<li>更新信息</li>
<li>程序信息</li>
</ul>
</li>
<li>
<span>会员管理</span>
<ul>
<li>新增会员</li>
<li>审核会员</li>
</ul>
</li>
</ul>
树控件数据格式化:
id:节点 ID,对加载远程数据很重要。
text:显示节点文本。(必选)
state:节点状态,'open' 或 'closed',默认:'open'。如果为'closed'的时候,
将不自动展开该节点。
checked:表示该节点是否被选中。
attributes: 被添加到节点的自定义属性。
children: 一个节点数组声明了若干节点。
//JS 加载方式
<ul id="box"></ul>
$('#box').tree({
url : 'tree.json',
});
[{
"id" : 1,
"text" : "系统管理",
"iconCls" : "icon-save",
"children" : [{
"text" : "主机信息",
"checked" : false,
"state" : "closed",
"children" : [{
"text" : "版本信息"
},{
"text" : "程序信息"
}]
},{
"text" : "更新信息",
"checked" : true,
"attributes" : {
"url":"/demo/book/abc",
"price":100
}
},{
"text" : "程序信息"
}]
},{
"id" : 2,
"text" : "会员管理",
"children" : [{
"text" : "新增会员"
},{
"text" : "审核会员"
}]
}]
二.属性列表
属性表格的属性扩展自 Tree(数据表格),属性表格新增的的属性如下
//tree 属性
$('#box').tree({
url : 'tree.json',
lines : true,
checkbox : true,
animate : true,
cascadeCheck : true,
dnd : true,
data : [{
text : '新增的'
}],
onlyLeafCheck : true,
});
Tree( 树) 组件[1]的更多相关文章
- Tree( 树) 组件[4]
本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件.一.方法列表 //部分方法onClick : funct ...
- Tree( 树) 组件[3]
本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件.一. 事件列表很多事件的回调函数都包含'node'参数, ...
- Tree( 树) 组件[2]
本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件.一. 异步加载如果想从数据库里获取导航内容, 那么就必须 ...
- 第二百二十六节,jQuery EasyUI,Tree(树)组件
jQuery EasyUI,Tree(树)组件 本节课重点了解 EasyUI 中 Tree(树)组件的使用方法,这个组件依赖于 Draggable(拖 动)和 Droppable(放置)组件. 一.加 ...
- element-ui的Tree树组件使用技巧
目录 1,前言 2,需求 3,解决思路 4,完整代码 5,总结 1,前言 最近这段时间在做一个新的模块,其中有一个三层的树结构,产品经理提出了一个很古怪的需求,整的我只能自己控制树的交互,写完之后,感 ...
- EasyUI - Tree 树组件
效果: 数据库设计: 使用的数据: 其中的字段,是跟据要生成的树节点的属性定义的. text:代表要显示的字段名称. state:是否是目录节点. iconCls:节点的图标是什么. url:跳转的链 ...
- 基于HTML5树组件延迟加载技术实现
HT for Web的HTML5树组件有延迟加载的功能,这个功能对于那些需要从服务器读取具有层级依赖关系数据时非常有用,需要获取数据的时候再向服务器发起请求,这样可减轻服务器压力,同时也减少了浏览器的 ...
- HT for Web的HTML5树组件延迟加载技术实现
HT for Web的HTML5树组件有延迟加载的功能,这个功能对于那些需要从服务器读取具有层级依赖关系数据时非常有用,需要获取数据的时候再向服务器发起请求,这样可减轻服务器压力,同时也减少了浏览器的 ...
- GUI树组件,表格
树组件首先要new一个JTree,再加结点,然后添加到 JScrollPane JTree tree1=new JTree(); //.......添加节点 add(new ScrollPane(tr ...
随机推荐
- DeviceToken 获取失败,原因:Error Domain=NSCocoaErrorDomain Code=3000 "未找到应用程序的“aps-environment”的授权字符串"...
apns -> 注册推送功能时发生错误, 错误信息: Error Domain=NSCocoaErrorDomain Code=3000 "未找到应用程序的“aps-environme ...
- JavaScript 客户端JavaScript之 脚本化浏览器窗口
1.计时器 客户端Javascript以全局函数setTimeOut().clearTimeOut().setInterval().clearInterval()提供这一功能. 前者是从运行的那一 ...
- 武汉科技大学ACM:1008: 零起点学算法64——回型矩阵
Problem Description 输出n*m的回型矩阵 Input 多组测试数据 每组输入2个整数 n和m(不大于20) Output 输出n*m的回型矩阵,要求左上角元素是1,(每个元素占2个 ...
- VS2010 C++ 优化配置
个人感觉VC6.0太土了,而且有很多bug存在,且微软早就不对其更新.所以,在选择C++编程的时候.使用IDE,VC6.0一段时间以后,我毅然决然的放弃了,觉得还是使用VS2010比较有前途. 但是当 ...
- 狗狗40题~(Volume A)
A - The Willy Memorial Program 大模拟题…… 一开始的思路不对,修修补补WA了十发.当时想直接一个并查集做连通来搞定它,结果发现不能很好地判断各管的水位.究其原因还是因为 ...
- 1.3.1 switch 语句中的 String
switch语句是一种高效的多路语句,可以省掉很多繁杂的嵌套if判断: 在Java 6及之前,case语句中的常量只能是byte.char.short和int(也可以是对应的封装类)或枚举常量,在Ja ...
- Input File 表单上传按钮美化
HTML <div class="input-file-button"> 上传图片<input type="file" class=" ...
- SQL中对日期进行模糊查询的方法
在我们通过SQL语句对数据库中的数据进行查询时,难免会遇到针对datetime的查询,但是因为一般情况下,输入的时间条件为年月日,所以,这种情况下,我们就要进行一下模糊查询,首先,摒弃一种投机取巧的方 ...
- 用C实现一个简单的对拍器——致每个曾经为求AC披星戴月的程序员们
大一新生,首次创作,虚心受教. 实现思路: 一.需要一个输入文件(input.txt),两个对拍程序(main1.exe,main2.exe) 二.将标准输入重定向为input.txt.将标准输出分别 ...
- Android实现三级联动下拉框 下拉列表spinner
Android实现(省.市.县)三级联动下拉框 下拉列表spinner 转载请注明出处: http://www.goteny.com/articles/2013/11/46.html http://w ...