I am working on a site that must drag and drop items, I use scriptaculous 1.8.2, effects, dragdrop.js.
See the picture of the website:
or http://img11.imageshack.us/img11/4913/myplansite.jpg
(each number 1..8 is an drag and a dropable)

But now I am lost, I kan drag, i can drop and invoke the onEnd or on Drop event, but can't find it out to get the data from the dragged and the dropped element together.

What are I am trying:
1) Have element that is dragable, and and element that is dropable
2) The data of the dragable must be put in an ajax request (already coded) so I can update the mysql database so that:
(1)The data at the position of the dragable gets removed
(2)and the position of the dropable gets filled with that data

What do I ask:
1) How can I call the data of the dragable?
2) How can I call the data of the dropable?

I hope there are people out here that have already experience with this!

Thanks in advance,

8 Years
Discussion Span
Last Post by kvdd

No thanks for the replies :-) after two days of struggling I figure out how it works. Also No thanks to the wiki of github/Scriptaculous!! - very incomplete.
My script to get it work:

function createDrag(id){
	new Draggable(id, { 
		revert: true, 
		scroll: window

function createDrop(id){
	Droppables.add(id, {
	  onDrop: function(drag, drop) {

I create the draggable at an onMouseDown event, and the dropables already when the page loads.
Now I have - as you can see in my posted code - the drag and the drop id.

I am done.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.