views:

32

answers:

0

I have some draggable elements in the DOM, which if dropped become draggable disabled. Now there can be only one element in the droppable at a time. So if the user drags another draggable and drops it, the previous dropped element must get removed from the droppable and the currently dragged element must replace it in the droppable. How can I do this??

This is my draggable:

$('#draggable').draggable({
  helper: "clone",
  revert: 'invalid',
  containment: '#drag-drop-wrapper',
  appendTo: '#doc-container'
});

And my droppable

$('#droppable').droppable({
  accept: ".session",
  drop: function(event,ui){
    //Need the code to replace old dropped item with new dropped item
  }
});

Please help. Thanks in advance.