Drag and Drop

[oi@Sorenso]

Hello!

I need a script so that I can drag an object (picture) and drop it in
another object (ex: basket). When I do that, I want to run an action. Do
anyone know how I can do this... mabye some tutorial or code?

Thanks for all answers!!!!!

[belama]

Add the these attibutes to divs and youll be able to drag and select controls and text.

<div contenteditable="true" indicateeditable="true"></div>

[alpha_foobar]

I found some good dragable layer code: http://www.howtocreate.co.uk/jslibs/

The code here allows you to create your own dhtml components that are moveable... I edited this code for my website: http://homepages.ihug.co.nz/~jlittle/index.html

But really drag and drop functionality is just drag functionality + knowing what the relationship is between objects.... if you can maintain a list of objects that have knowledge of their bounds... then you can use that implement drop functionality.

[belama]

http://www.walterzorn.com/dragdrop/dragdrop_e.htmThis one is worth looking at. :D
Check for yourself.

[alpha_foobar]

http://www.walterzorn.com/dragdrop/dragdrop_e.htmThis one is worth looking at. :D
Check for yourself.

I like it. Though I think it would take me a while to come up with a purpose for it :)

[sj669]

Hi, I'm creating a calendar in open code using drag drop, so that people can drag a word likerevise into a box.

At the moment when you drag the word revise onto the calendar it will stay exactly where you leave it onmouseup, even if it is lying over two boxes on the calendar. Ideally what Is that if the word is more over a certain box onmouseup then it will relocate to that box.

this is like when playing solitair on windowsthe cards will snap to the correct place

Ideally this needs to all be in open code.

Thanks

SJ

[alpha_foobar]

Hi,

I could edit your code for you. And publish the source, however I would be asking for US$60 an hour.

The problem is a little tricky... but if you are able to move the text already, then you have implemented about 60% of the core. And you know where the mouseup event occured, hence you have a mechanism of working out where you should 'snap' to.

The next problem is the 'snap'. I'd say the easiest way is to assign a mouseup event to each calendar cell, so when mouseup occurs you capture it in the cell you should be snapped to.

Then you will be able to work out the X and Y co-ordinates of your cell. And then you can snap your text.

Hmmm... sounds easy now.

[sj669]

OK now my problem is that i want to save the position of the drag drop layers on the screen

If anyone wants to see what's been done already email [e-mail] and make the subject !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! and i will email you the code.

thanks

sj

[tgreer]

Save the values into cookies.

[alpha_foobar]

yup, cookies are a good idea...

I have seen another reasonably good idea (depending on the implementation/function of your site) and that is what is done with http://www.tiddlywiki.com/ the idea is that it is a wiki that you can save on a usb stick and carry where ever you go (with a computer). As opposed to a normal wiki that is every where you go with a good internet connection.

And you are perhaps more advanced than this, but this page contains a very nice drag and drop example http://script.aculo.us/