最简单的TreeNode例子
////////////固定节点////////////////////
??? Ext.onReady(function(){
??? ?var nodeba={
??? ???nodeType:"async",
??? ???text:"b子节点ba",
??? ???checked:false,//这样的checked：false才会出现复选框
??? ???leaf:true ,
??? ???listeners:{
??? ???????? click:function(){
??? ??????????? Ext.Msg.alert("aaaaaaa");
??????????? }
??? ?}};
??? ?var nodebb=new Ext.tree.TreeNode({
??? ???? nodeType:"async",
?????????????? id:"bc",
??? ???? text:"b子节点bb",
??? ???? leaf:true,
??? ???? checked:false,//增加的是一个复选框,但是这种格式的checked来不起
??? ???? listeners:{
??? ????? 'onClick':function(){
??? ???????????????? Ext.Msg.alert("cccccccccvvvv");
??? ???????? }
?????????????? }
??? ?});
??? ?var nodeaa={
?????????? text:"a子节点aa",
?????????? checked:false,
?????????? leaf:true
??????? };
??????? var nodeab={
???????????? text:"a子节点ab",
???????????? checked:false,
???????????? leaf:true
??????? };
??? ?var nodeb={
??????? ??nodeType:"async",
??????? ??text:"子节点b",
??????? ??checked:false,
??????? ??leaf:false,
??????? ??children:[nodeba,nodebb]
??????? };
??????? var nodea={nodeType:"async",text:"子节点a",leaf:false,checked:false,children:[nodeaa,nodeab]};
??????? var nodec={nodeType:"async",text:"子节点c",checked:false,leaf:true};
??? ?var tree=new Ext.tree.TreePanel({
??? ???? useArrows: true,
??? ???? autoScroll: true,
??? ???? animate: true,
??? ???? enableDD: true,
??? ???? rootVisible : true,
??? ???? containerScroll: true,
??? ???? renderTo:"divTree",
??? ???? collapsible:true,
??? ???? border: false,
??? ???? root: {
??? ????? nodeType: 'async',
??? ????? text: '根节点',
??? ????? draggable: false,
??? ????? checked:false,
??? ????? id: 'source',
??? ????? children:[nodea,nodeb,nodec]
??? ???? }
??? ?});?
??? ?var button=new Ext.Button({
??????????? renderTo:"divButton",
??????????? text:"选中",
??????????? type:"submit",
??????????? name:"button",
??????????? handler:function(){
?????????????? var checkeds=tree.getChecked();
?????????????? for(var i=0;i<checkeds.length;i++){
??????????????????? alert("选中项:"+checkeds[i].text);//checkeds[i]就代表着我们定义的节点eg:nodec,nodea等等,
?????????????????????????????????? //所以可以直接用checkeds[i]点击里面的属性text
????????????? }
??????????? }
??????? });
??? ???? ????
??? });
???????
</script>
<body>
<div id="divTree"></div>
<div id="divButton"></div>
</body>
?
?