ext TreePanel树节点操作
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)" />事件,每次激发,传入的节点值node一直在改变,陷入一个死循环。因此要加入suspendevents()停止监听事件,执行完后再恢复监听
22 如果使用ext.quicktips.init()替换tree.expandall(),则只显示根节点。
上一篇: 武则天为什么要毁上官婉儿的容貌?
下一篇: tree 树形加载及增删改
推荐阅读
-
jQuery插件zTree实现的基本树与节点获取操作示例
-
ext TreePanel树节点操作
-
jQuery插件zTree实现的基本树与节点获取操作示例
-
Ext.form.ComboBox,Extjs-树 Ext.tree.TreePanel
-
Ext6 treePanel默认加载两级或多级本地树信息其他加载远程数据
-
Ext6 treePanel默认加载两级或多级本地树信息其他加载远程数据
-
JavaScript数据结构与算法之二叉树添加/删除节点操作示例
-
JS 关于树的操作 查找所有子节点,找出某一节点的父节点
-
学习YUI.Ext 第六天--关于树TreePanel(Part 1)_YUI.Ext相关
-
ext TreePanel树节点操作