extjs关于treePanel+chekBox全部选中以及清空选中问题探讨

treePanel+chekBox全部选中以及清空选中，想必大家在学习使用过程中都见过这种效果吧，接下来为大家详细介绍下实现过程及细节，感兴趣的朋友可以参考下哈

 
//树 
var treePanel = new Ext.tree.TreePanel({ 
id:'ptree', 
region:'west', 
layout:'anchor', 
border:false, 
rootVisible: false, 
root:{}, 
listeners:{ 
render: function() { 
authorityTree(treePanel); /*渲染树*/ 
}, 
checkchange: function(node, state) { 
if (node.parentNode != null) { 
//选中子节点让相应的父节点选中 
var pNode = node.parentNode; 
if (state || treePanel.getChecked(id, pNode) == "") { 
pNode.ui.toggleCheck(state);// 触发父节点被选中 
pNode.attributes.checked = state; 
} 
} 
treeId = node.attributes.id; 
treeName = node.attributes.text; 
} 
} 
}); 
//操作按钮 
tbar: [{ 
id: 'btnQingKong', 
text: '清空', 
iconCls: 'winupdate-icon', 
handler: function() { 
var nodes = Ext.getCmp('ptree').getChecked(); 
if (nodes && nodes.length) { 
for (var i = 0; i //设置UI状态为未选中状态 
nodes[i].getUI().toggleCheck(false); 
//设置节点属性为未选中状态 
nodes[i].attributes.checked = false; 
} 
} 
} 
},{ 
id: 'btnQuanXuan', 
text: '全选', 
iconCls: 'winupdate-icon', 
handler: function() { 
var nodeT = Ext.getCmp('ptree').getRootNode(); 
treeCheckTrue(nodeT); 
} 
}] 
/** 
*checkTree全选 
*/ 
var treeCheckTrue = function(node) 
{ 
node.eachChild(function (child) { 
child.getUI().toggleCheck(true); 
child.attributes.checked = true; 
treeCheckTrue(child); 
}); 
} 
/** 
*checkTree清空 
*/ 
var treeCheckfalse = function(tree) 
{ 
var nodes = tree.getChecked(); 
if(nodes && nodes.length){ 
for(var i=0;i//设置UI状态为未选中状态 
nodes[i].getUI().toggleCheck(false); 
//设置节点属性为未选中状态 
nodes[i].attributes.checked=false; 
} 
} 
} 