Need help to re-enable dragging of a draggable

Question

I have a draggable element

$(".element").draggable({
helper: "clone",
revert: 'invalid',
containment: '#parent',
appendTo: '#parent'
});

I have two issues:

1. After this element is dropped, the original gets disabled automatically.

2. A close anchor tag is appended to the dropped element. On click of this 'close' the original element should again become draggable and should be removed from the droppable 'div'.

I have written a handler for the close anchor as follows, it removes the element from the droppable but it doesn't make it draggable aggain.

$('.cancel a',ui.helper).click(function()
{
   $(ui.helper).remove();
   $(ui.draggable).draggable('enable');
});

Please help. Thanks in advance.

Answer 1

The answer for the first issue is set the disabled option of the draggable element as false.

    $(".element").draggable({
      helper: "clone",
      revert: 'invalid',
      disabled: false,
      containment: '#parent',
      appendTo: '#parent'
    });

On handler for close anchor, enable the draggable object which you want to drag. For example,

    $('.cancel a',ui.helper).click(function()
    {
       $(ui.helper).remove();
       $('#element').draggable('enable');
    });