Ext里面的tree怎么设置才可以让它的节点有拖动的效果

Question

我是这样设置的
 tree = new Ext.tree.TreePanel({
                title: "",
                region: "west",
                animate: true,
                useArrows: true,
                autoScroll: true,
                enableDD: true,
                containerScroll: true,
                model: true,
                width: 155,
                collapsible: false,
                loader: treeLoader,
                lines: true,
                rootVisible: false,
                selModel: new Ext.tree.MultiSelectionModel(),
                height: 546,
                listeners: {
                    "click": function (node, e) {
                      ……此处省略了                        
                    },
                    "movenode": function (tree, node, oldNode, newNode, index) {
                     ……此处省略了                    }
                }但是不能达到效果，根本就无法拖动，各位大侠大仙们能教教小弟怎么实现吗，急啊！

Answer 1

为什么要拖动？
参考var store = Ext.create('Ext.data.TreeStore', {
    root: {
        expanded: true, 
        text:"",
        user:"",
        status:"", 
        children: [
            { text:"detention", expanded: true,
children:[
{ leaf: true,text:'aaa'},
{ leaf: true,text:'bbb'}
]
},
            { text:"homework", expanded: true, 
                children: [
                    { leaf: true,text:'ccc'}
                ]
            },
            { text: "buy lottery tickets", leaf:true }
        ]
    }
});     var txtTreePanel=Ext.create('Ext.tree.Panel', {
    height: '100%',
    store: store,
    rootVisible: false,
listeners : {  
        itemclick : function(view,re){  
            alert(re.data.text);
        }  
    }
});//Viewport 
Ext.create('Ext.container.Viewport', {
    layout: 'border',
    renderTo: Ext.getBody(),
    items: [{
        region: 'north',
        html: '<h1 id="nobrDateTimeInfo" style="width:100%;text-align:right;"></h1>',
        autoHeight: true,
        border: false,
        margins: '0 0 5 0',
height:'15%'
    }, {
        region: 'west',
        collapsible: true,
        title: 'Navigation',
        width: 150,
items:txtTreePanel  //树型导航
    }, {
        region: 'south',
        title: 'South Panel',
        collapsible: true,
        html: 'Information goes here',
        split: true,
        height: 100,
        minHeight: 100
    }, {
        region: 'east',
        title: 'East Panel',
        collapsible: true,
        split: true,
        width: 150
    }, {
        region: 'center',
        xtype: 'tabpanel', // TabPanel itself has no title
        activeTab: 0,      // First tab active by default
        items: {
            title: 'Default Tab',
            html: 'The first tab\'s content. Others may be added dynamically'
        }
    }]
});