Extjs Ext.TreePanel

<link rel="stylesheet" href="Js/ext-4.2/resources/css/ext-all-neptune.css"/>
<script src="Js/jQuery/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="Js/ext-4.2/ext-all-dev.js" type="text/javascript"></script> <script type="text/javascript"> var tree;
$(document).ready(function() { //Ext.create('Ext.tree.Panel', { }); tree = new Ext.tree.TreePanel({
renderTo: 'tree1',
title: 'Simple Tree',
multiSelect: true,
width: 200,
height: 450,
viewConfig: {
onCheckboxChange: function(e, t) {
var item = e.getTarget(this.getItemSelector(), this.getTargetEl()), record; if (item) {
record = this.getRecord(item);
var check = !record.get('checked');
//getSelectedNodes()
record.set('checked', check);
if (check) {
record.bubble(function(parentNode) {
parentNode.set('checked', true);
});
record.cascadeBy(function(node) {
node.set('checked', true);
});
// record.expand(); 联动效果 自动收起 自动展开
// record.expandChildren();
} else {
// record.collapse();
// record.collapseChildren();
record.cascadeBy(function(node) {
node.set('checked', false);
});
record.bubble(function(parentNode) {
var childHasChecked = false;
var childNodes = parentNode.childNodes;
if (childNodes || childNodes.length > 0) {
for (var i = 0; i < childNodes.length; i++) {
if (childNodes[i].data.checked) {
childHasChecked = true;
break;
}
}
}
if (!childHasChecked) {
parentNode.set('checked', false);
}
}); }
}
}
},
root: {
text: 'Root',
expanded: true, //是否展开子节点，默认为false
checked: true,
children: [
{ id: '1', text: 'Child 1', checked: true, leaf: true },
{ id: '2', text: 'Child 2', checked: true, leaf: true },
{ id: '3', text: 'Child 3', checked: true, expanded: true, children: [{ id: '4', text: 'Grandchild', checked: true, leaf: true}] }
]
}
}); //窗体
var win = new Ext.Window({
title: '窗口',
width: 476,
height: 574,
resizable: true,
modal: true,
closable: true,
maximizable: true,
minimizable: true,
items: tree
});
win.show(); var attr = tree.getChecked(); for (var le = 0; le < attr.length; le++) {
var json = eval(attr[le].getData());
json.text;
} }); </script>