PDA

View Full Version : DD: grid to tree, grid to div



napiform
24 Jun 2011, 4:58 AM
Hello all -

I'm trying to implement two drag and drop capabilities:

(1) drag from grid --> drop on tree
(2) drag from grid --> drop on div

I know there are several tutorials online about how to do this but I get confused about which parts of the code are actually implementing DD and which parts are creating complicated grids, trees, etc.

If anyone could provide an outline of what I need to do to implement drag and drop (on top of an existing grid and tree and div), I'd be very grateful.

Thank you.

colorful
24 Jun 2011, 3:18 PM
Does anyone have a suggestion?

skirtle
26 Jun 2011, 4:03 AM
Hard to know what to suggest if you can't follow examples. A lot of people found this one helpful:

http://www.sencha.com/blog/5-steps-to-understanding-drag-and-drop-with-ext-js/

This grid-to-grid example is also relatively simple:

http://dev.sencha.com/deploy/ext-3.4.0/examples/dd/dnd_grid_to_grid.html

To make your grid draggable you just need to set enableDragDrop: true. You then need to create a drop target wherever the dragged nodes can be dropped. The logic for determining what happens once a node (row) is dropped is completely different for each app. Usually you need to implement some template methods in the target to add that logic. For a tree you'll probably want to use an Ext.tree.TreeDropZone, for the DIV you'll probably want either an Ext.dd.DDTarget or an Ext.dd.DropTarget. I suggest reading the API docs for all those classes.

napiform
27 Jun 2011, 5:57 AM
Thanks! That's a big help.