Question

I have an ExtJs TreePanel in which i’ve set the enableDrop as true and set the property ddGroup to one of the groups. I have this another ExtJs view from where i need to drag and drop the images. And i know that ddGroup defined for this is media

However the drag and drop never happens. This is my code snippet:

var treePanel = new Ext.tree.TreePanel({
 "id": "myTree",
 "lines": true,
 "animate": true,
 "enableDrop": true,
 "enableDrag": false,
 "ddGroup": "media",
 "containerScroll": true,
 "autoScroll": true,
 "split": true,
 "stateful": true,
 "renderTo": "treeStruc",
 "loader": //my loader,
 "root": new Ext.tree.AsyncTreeNode(treeRootConfig),
 "dropConfig": {
  "ddGroup": 'media'
 },
 "listeners": { 
  "nodedrop": function(e) {   
   //do the check
  }
 }                    
});

Is there anything else that needs to be done?

Thanks.

Answer 1

Although the documentation states that nodedrop is fired when a "DD object" is dropped on a tree node, the source seems to indicate that it’s still expecting a valid node.

In order to implement the drag-drop from view to tree, I believe you would have to initialize your own TreeDropZone to handle dropped DD items that are not tree-compatible nodes.

This example: http://dev.sencha.com/deploy/dev/examples/dd/dragdropzones.html shows something similar (although it is a view to grid drag-drop), but you’ll likely have to use a TreeDropZone instantiation where they’ve used a straight out Ext.dd.DropZone object.

Also, make sure that your source view and the target tree share the same ddGroup – although I think you mentioned that they do.

I hope this is in any way helpful!