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();
项目中通常获取节点选中父节点或全部子节点(代码如下):
tree.on('checkchange', function(node) { tree.suspendEvents(); //暂停所有监听事件的执行 treeclick(node); parentclick(node); tree.resumeEvents(); //重新开始所有监听事件的执行 }, tree); //选中父节点 function parentclick(node){ var parentNode = node.parentNode;//获取父节点 if (parentNode != null) { var isNotChecked = false; var someChecked = false; var childCount = parentNode.childNodes.length; for (var i = 0; i < childCount; i++) { var child = parentNode.childNodes[i]; if (child.attributes.checked) { someChecked = true; } else { isNotChecked = true; } } if (someChecked) { parentNode.attributes.checked = true; parentNode.ui.toggleCheck(true); } else if (isNotChecked) { parentNode.attributes.checked = false; parentNode.ui.toggleCheck(false); } parentclick(parentNode);//递归选中父节点 } } //选择子节点 function treeclick(node){ var isChecked = node.attributes.checked;//获取选中状态 if (node.hasChildNodes()) { //是否有子节点 node.eachChild(function(child) { //循环下一级的所有子节点 child.ui.toggleCheck(isChecked); //选中 child.attributes.checked = isChecked; //赋值 treeclick(child); //递归选中子节点 }); } }