最简单Ext.Tree扩展CheckBox的方法

< language=javascript type=text/javascript>

var tree = null;
var txtChkValue = document.getElementById("txtChkValue");
Ext.onReady(function(){

Ext.BLANK_IMAGE_URL = "../../Js/extjs2/resources/images/default/s.gif"
// shorthand
var Tree = Ext.tree;

tree = new Tree.TreePanel({
el:'tree-div',
autoScroll:true,
animate:true,
enableDD:false,
containerScroll: true,
onlyLeafCheckable: false,//对树所有结点都可选
loader: new Tree.TreeLoader({
dataUrl:'../../getTreeData.aspx'
}),
margins:'15,15,15,15',
border:false
});

tree.on('checkchange', function(node, checked) {
node.expand();
node.attributes.checked = checked;
var parentNode = node.parentNode;
if(checked){
if(parentNode!=null&&parentNode.id!='source'){
//如果是选中,把父节点保持选中状态
parentNode.ui.toggleCheck(true);
parentNode.attributes.checked = true;
}
}else{
//如果所有子节点都没选中，取消根节点选中状态
if(parentNode!=null&&parentNode.id!='source'){
var chk = false;
parentNode.eachChild(function(child) {
if(child.attributes.checked)chk=true;
});
parentNode.ui.toggleCheck(chk);
parentNode.attributes.checked = chk;
}
}
node.eachChild(function(child) {
child.ui.toggleCheck(checked);
child.attributes.checked = checked;
child.fireEvent('checkchange', child, checked);
});
txtChkValue.value = tree.getChecked('id');
}, tree);

// set the root node
var root = new Tree.AsyncTreeNode({
text: '请选择要生成的栏目',
draggable:false,
id:'source'
});
tree.setRootNode(root);

// render the tree
tree.render();
root.expand();
});