DnD between treepanels

[admiralato]

I've been working with ExtJS for a while now and I am currently stuck on a problem, so here's my problem...

- I have a tree panel let's call it MainTree
- I have an explore function that when a user right-clicks a node from MainTree, it displays all the child nodes of that node in a separate tree and window, let's call this tree..Tree2. You can display numerous trees in a separate window from exploring the nodes from MainTree, so you can have Tree3, Tree4, Tree5, and so on..
- Now from the windows and trees that are created in this explore function, I need to be able to drag nodes from Tree2 to the MainTree or vice versa, Tree2 to Tree3 and vice versa..and so on. Basically, I need to be able to drag nodes from wherever tree I want.

Currently, I was able to drag & drop nodes from Tree2 to the MainTree, it only works during the first drop, but on the second time, the Tree2 events doesn't trigger anymore...and I wonder why that happens...why actually does it only work for the first DnD?

Hope you could help.

[jay@moduscreate.com]

I'm going to post this quick and dirty example on my blog soon:

Ext.BLANK_IMAGE_URL='/ext2/resources/images/default/s.gif'
Ext.onReady(function() {
    var childItems = [{
        text     :  'woot',
        children : [
            {
                text      : 'woot1',
                allowDrag : true,
                allowDrop : false,
                leaf      : true
            },
            {
                text      : 'woot2',
                allowDrag : true,
                allowDrop : false,
                leaf      : true
            }
        ]
    },
    {
        text     :  'foo',
        children : [
            {
                text      : 'bar1',
                allowDrag : true,
                allowDrop : false,
                leaf      : true
            },
            {
                text      : 'bar2',
                allowDrag : true,
                allowDrop : false,
                leaf      : true
            }
        ]
    }];

   
    var srcTree = new Ext.tree.TreePanel({
        title       : 'source tree',
        columnWidth : .5,
        height      : 200,
        enableDD    : true,
        ddConfig    : {
            allowDrop : false
        },
        root     : new Ext.tree.AsyncTreeNode({
            text      : 'Tree root',
            children  : childItems,
            expanded  : true,
            allowDrag : false
   
        })
    });
   
    var destTree = new Ext.tree.TreePanel({
        title       : 'dest tree',
        columnWidth : .5,
        height      : 200,
        enableDD    : true,
        ddConfig    : {
            allowDrop : false
        },
        root     : new Ext.tree.AsyncTreeNode({
            text      : 'Tree root',
            allowDrag : false,
            children  : [],
            expanded  : true
        })
    });


   new Ext.Panel({
        renderTo : Ext.getBody(),
        layout   : 'column',
        height   : 200,
        width    : 400,
        items    : [
            srcTree,
            destTree    
        ]
    });
});