ExtJs TreePanel 使用帮助
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)" />事件,
每次激发,传入的节点值node一直在改变,陷入一个死循环。因此要加入suspendEvents()停止监听事件,执行完后再恢复监听 22 如果使用Ext.QuickTips.init()替换tree.expandAll(),则只显示根节点。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。