ExtJs TreePanel 使用帮助
来源:互联网 发布:淘宝上的vr才39靠谱吗 编辑:程序博客网 时间:2024/05/29 18:36
tree :树 node:节点
1、全部展开 tree.expandAll();
2、全部收缩 tree.collapseAll();
3、得到父节点 node.parentNode
4、判断是否有父节点 node.parentNode==
null
5、判断是否有子节点 node.hasChildNodes()
6、获取下一级所有子节点 node.eachChild(function(child) { })
7、获取选择的节点 tree.getSelectionModel().getSelectedNode()
8、设置选中节点 node.
select
()
9、上移节点 node.selectPrevious();
10、下移节点 node.selectNext();
11、获取节点ID node.id
12、获取节点值 node.text
13、获取节点提示 node.attributes.qtip
带选择框
14、获取选中的的节点
var
check= tree.getChecked();
Ext.each(check ,function(node){})
15、获取是否选择 node.getUI().checkbox.
checked
;
16、设置节点选择 node.ui.toggleCheck(
true
);
//显示选中 node.attributes.checked = true; //赋值
17、设置一个新的节点
var
newNode=
new
Ext.tree.TreeNode({id:
'id'
,text:
'text'
,iconCls:
'icon-group'
,qtip:
'tip'
}); iconCls 导入的是CSS设置的背景图片(节点图标)
css写法: .x-tree-node-leaf .icon-
group
{ background-image:url(
group
.png);} 前.x-tree-node-leaf必写
18、插入新的节点 node.appendChild(newNode);
19、删除节点 node.remove();
20
这里说的选中是指鼠标点击一个节点后,节点那一行出现浅蓝色背景的选中,而非checkbox的勾选
方法
Ext.tree.TreePanel.getSelectionModel().getSelectedNode();
Ext.tree.TreePanel.getSelectionModel()获得的是一个TreeSelectionModel对象,
这个TreeSelectionModel目前在Ext中有两个Ext.tree.DefaultSelectionModel和Ext.tree.MultiSelectionModel
Ext.tree.MultiSelectionModel的获取选中节点的方法是getSelectedNodes (),这个返回的是节点数组,Ext.tree.DefaultSelectionModel.getSelectedNode()返回的是单个节点对象
21 选中节点和父节点
1)、父节点选择
function parentclick(node)
{
var
parent=node.parentNode;
//获取父节点
var
flag=node.getUI().checkbox.
checked
;
//判断是否选中
if
(parent!=
null
)
//父节点不为空
{
parent.ui.toggleCheck(flag);
//选中
parent.attributes.
checked
= flag;
//给值
parentclick(parent);
//递归调用选中父节点
}
}
2)、选择子节点
function treeclick(node)
{
var
flag=node.getUI().checkbox.
checked
;
//获取选中状态
if
(node.hasChildNodes()) {
//是否有子节点
node.eachChild(function(child) {
//循环下一级的所有子节点
child.ui.toggleCheck(flag);
//选中
child.attributes.
checked
= flag;
//赋值
treeclick(child);
//递归选中子节点
});
}
}
3)、2个函数合并执行
function check(node)
{
tree.suspendEvents();
//暂停所有监听事件的执行
treeclick(node);
parentclick(node);
tree.resumeEvents();
//重新开始所有监听事件的执行
}
注:
选中事件发生在子节点,但要通过toggleCheck()改变其父节点未被选中的状态,而一旦改变了父节点未被选中状态为选中状态,就会激发树中的<CheckChange Handler=
"check(node)"
/>事件,<br>每次激发,传入的节点值node一直在改变,陷入一个死循环。因此要加入suspendEvents()停止监听事件,执行完后再恢复监听
22 如果使用Ext.QuickTips.init()替换tree.expandAll(),则只显示根节点。
0 0
- ExtJs TreePanel 使用帮助
- ExtJS中TreePanel的使用
- extjs treepanel
- Extjs 4.0.7 TreePanel的使用
- ExtJs treepanel和TabPanel配合使用
- extjs 使用TreePanel动态新建一棵数
- EXTJS中TreePanel和TabPanel配合使用的问题
- ExtJS专题-TreePanel(1)
- ExtJS专题-TreePanel(1)
- ExtJS专题-TreePanel(2)
- ExtJS专题-TreePanel(1)
- ExtJs之TreePanel篇
- Extjs的TreePanel
- ExtJs——TreePanel!!!
- Extjs TreePanel 完美实现
- EXTJS 专题 TreePanel
- extjs 异步treepanel创建
- ExtJS专题-TreePanel
- css优先级和四种接入方式
- Navicat Premium 11.0.17 32位+64位 简体中文破解版(多重数据库管理工具)
- 天声人語 20150923
- 通过Mongo, Docker和Rancher创建Node.js应用集群
- CF#319-C. Vasya and Petya's Game-猜数-数论
- ExtJs TreePanel 使用帮助
- 高性能MySQL
- Flex Builder启动项目一直停留在57%
- Wireshark Ethereal 1.11.2 32位+64位 稳定版(网络分析工具,抓包工具)
- 找出一个字符数组(元素不重复)所有可能字符的组合
- 【读书笔记】架构是最高层次的规划和难以改变的决定
- XML转JSON
- MySQL多表查询
- A1101. Quick Sort (25)