Maybe try creating the draggable like this:
$(".draggable").draggable({
helper: function() {
return $(this).clone();
},
...
});
Be careful that you don't clone an item with an ID, or if you do, make sure to change it to something else so that you don't end up with invalid markup.
--Erik
<div><span class="gmail_quote">On 10/20/07, <b class="gmail_sendername">erdibalint</b> <<a href="mailto:erdibalint@gmail.com">
erdibalint@gmail.com</a>> wrote:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">
Hi,
My idea is quite simple: drag and drop an image (wrapped in a div) to
another, bigger image (also in a div). I also want the draggable
images to be cloned so that they can be dragged and dropped again.
For a start I made the draggable images draggable:
$(".draggable").draggable(
{ helper: 'clone', ... }
)
and the big image droppable:
$("#canvas").droppable(
{ accept: ".draggable", tolerance: "fit", ... }
)
The drag and drop functionality works, if I show a "success message"
when the image is dropped, it displays all right, so everything seems
to be all right.
My problem is that the dragged object (image wrapped in the div)
disappears when dropped. I have found out that this is because of the
clone helper, if I remove the helper: 'clone' line than the dropped
image stays at its final position. However, I want it to be cloned so
it can be dragged again from its original position as I described
above.
Is there a way for a draggable object to be cloned and not to
disappear after being dropped at the same time? I know that the 'drop'
function in the droppable definition is passed the dragged object (or
the drag event?) but I haven't found a way to use this to achieve what
I want.
Could you help me out? Thank you very much,
Balint
ui. Is there a more verbose documentation on jquery.ui than the one on
<a href="http://docs.jquery.com/UI">
http://docs.jquery.com/UI</a>? I tried to get info out of the source code
(as the source of the best documentation) but I am not yet at that
level of understanding the vast possibilities of javascript, I
reckon :)
</blockquote></div>