How can I remove the original element after doing a draggable event with a 'clone' helper?

Question

I have a list of items which I have made draggable. I am dragging these over to several sortable lists. I have to use the 'clone' helper method while dragging as the other helper methods did not work properly.

Unfortunately, I don't want the item to remain in the original list once it has been dropped in the sortable list.

How do I remove the original item after a successful drag? (i.e. once it is contained in one of the sortable lists)

I thought I might be able to access the original element through the droppable event on the sortable lists but I'm not sure how to achieve this.

Thanks

Graeme

Answer 1

check this example (jQuery UI-demo for sortables)

Answer 2

This basic setup appears to do what you want.

$(function() {
    $(".drag").draggable({ helper: 'clone' });
    $("#dropArea").droppable({
  drop: function(event, ui) {
   //ui.draggable.appendTo(this);
   $(this).append(ui.draggable);
  }
 });
});

If this doesn't work for you, can you show us some code?