1.app.js
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.Loader.setConfig({
enabled:true
});
Ext.application({
name : 'AM',
appFolder : "app",
launch:function(){
Ext.create('Ext.container.Viewport', {
layout:'auto',
items: {
xtype: 'deptTree'
}
});
},
controllers:[
'deptController'
]
});
})
2.app/view/deptView
Ext.define("AM.view.deptView",{
extend:'Ext.tree.Panel',
alias: 'widget.deptTree',
title : '部门树形',
width : 250,
height: 300,
padding : '5 3 3 10',
rootVisible : false,//控制显隐的属性
dockedItems:[{
xtype:'toolbar',
dock:'left',
//ui:'footer',
items:[
{xtype:'button',text:'add',id:'add'},
{xtype:'button',text:'copy',id:'copy'},
{xtype:'button',text:'delete',id:'delete'}
]
},{
xtype:'toolbar',
items:[{
xtype:'button',
id:'allopen',
text:'展开全部'
},{
xtype:'button',
id:'allclose',
text:'收起全部'
}]
}],
store:'deptStore'
// root:{
// text:'root',
// id : '0',
// leaf:false,
// children:[{
// text:'技术部门',
// checked:false,
// id : '01',
// leaf:false,
// children:[{
// checked:false,
// text:'研发部',
// id : '0101',
// leaf:true
// },{
// checked:false,
// text:'实施部',
// id : '0102',
// leaf:true
// }]
// },{
// text:'后勤部门',
// id : '02',
// checked:false,
// leaf:false,
// children:[{
// text:'人事部',
// id : '0201',
// checked:false,
// leaf:true
// },{
// text:'行政部',
// id : '0202',
// checked:false,
// leaf:true
// }]
// }]
// }
});
3.app/store/deptStore
1 Ext.define("AM.store.deptStore",{ 2 extend:'Ext.data.TreeStore', 3 defaultRoodId:'root', 4 proxy:{ 5 type:'ajax', 6 url:'/extjs/extjs!getDept.action', 7 reader:'json', 8 autoLoad:true 9 } 10 });
4.app/controller/deptController
1 Ext.define('AM.controller.deptController', { 2 extend: 'Ext.app.Controller', 3 init:function(){ 4 this.control({ 5 "deptTree button[id=allopen]":{ 6 click:function(b,e){ 7 var tree = b.ownerCt.ownerCt; 8 tree.expandAll(); 9 } 10 }, 11 "deptTree button[id=allclose]":{ 12 click:function(b,e){ 13 var tree = b.ownerCt.ownerCt; 14 tree.collapseAll(); 15 } 16 }, 17 "deptTree button[id=add]":{ 18 click:function(b,e){ 19 var tree = b.ownerCt.ownerCt; 20 var nodes = tree.getChecked(); 21 if(nodes.length == 1){ 22 var node = nodes[0]; 23 node.appendChild({ 24 checked:true, 25 text:'技术架构组', 26 id : '0103', 27 leaf:true 28 }); 29 }else{ 30 alert("请您选择一个节点"); 31 } 32 } 33 }, 34 "deptTree":{ 35 itemclick:function(tree,record,item,index,e,options){ 36 alert(record.get('id')); 37 } 38 } 39 }); 40 }, 41 views:[ 42 'deptView' 43 ], 44 stores :[ 45 'deptStore' 46 ], 47 models :[ 48 ] 49 });