Forums

Hi People,

Just wondering if any of you have ever come across of Drag and Drop
examples that will allow one to drag and drop multiple items between
lists? That is, users would be able to use the "Shift" or "Ctrl"
buttons to select multiple items from LIST 1 and drag them to LIST 2 in
one go.

I've already have the code to drag and drop between lists but for 1
item at a time. The only method to move multiple items between lists
in one go that I'm aware of is to use <select multiple>, but with this
approach I loose the drag and drop feature and will be stuck with
buttons.

If any of you could help I'll really appreciate it.


Thank you

PD: Sorry for my bad english.
Two sites with similar examples

http://forkjavascript.org/drag/multiple

http://peter.michaux.ca/examples/yui-mu ... proxy.html

Can't say that I have, until viewing the examples you posted.

It seems to me that those two examples put forth some good ideas on how to implement this. I'd say that using the alt key like in the first example might be less intuitive than using the control key like the second example.

I would probably do this using a proxy drag and drop as per the second example. You should be able to tell which items are selected once you get the selection mechanism down. Then it should be a simple matter of implementing a valid drop function and moving the selected elements.

Hi,

It's entirely possible. I did exactly what you are looking for in one of my project.
My approach is to create a class extends from DDProxy. Check whether ctrl or shift is pressed in onMouseDown method. Use a variable for each list to track the last selected list item and an array for each list to record all the selected items.
If ctrl is pressed, the target list item is added into the selected items array. If shift is pressed, all the list items between the lastselectedItem and the target list item are added into the selected item array. If no shift or ctrl pressed, clean the array and add the target item to the array. Hide all the selected items in the startDrag function and insert all the selected items into the target list in the endDrag function.

It may be not a perfect solution. But it worked fine.
regards,
Bill