博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ext TreePanel树节点操作
阅读量:3520 次
发布时间:2019-05-20

本文共 2204 字,大约阅读时间需要 7 分钟。

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(),则只显示根节点。

转载地址:http://cymqj.baihongyu.com/

你可能感兴趣的文章
简单的JAVA小作品
查看>>
一些方便的遍历方法
查看>>
CMake下载
查看>>
未调用fflush产生的图片文件无法打开问题
查看>>
SQL 约束(二)
查看>>
SQL ALTER用法(三)
查看>>
SQL where子句及查询条件语句(六)
查看>>
SQL 连接JOIN(九)
查看>>
linux VM虚拟机可以ping通主机,但主机无法ping通虚拟机
查看>>
linux 错误码
查看>>
C++ 中Struct与typedef struct总结
查看>>
WNetAddConnection2调用失败,错误码1200/1312
查看>>
POI读写Excel的基本使用
查看>>
淘宝网站的架构演进
查看>>
设置zookeeper开机自启动流程
查看>>
CentOS安装mysql5.7的教详细流程
查看>>
项目整合微信扫码登录功能
查看>>
分布式文件系统FastDfs的搭建
查看>>
Springboot项目利用Java客户端调用FastDFS
查看>>
全文检索工具elasticsearch的安装和简单介绍
查看>>