Question

I have a list of items that are draggable :

$( "li" ).draggable({
      connectToSortable: ".sortable",
      helper: "clone"
});

Once an item is dragged and dropped I’d like to prevent the user from dragging the same item again. Can I achieve this ? Possibly adding some css to the just dragged item ?

If the user does not drop the item (cancels the drag) then future dragging for this item should remain enabled

Note: I cannot remove the helper: clone attribute.

Answer 1

Something like this might work:

$( "li" ).draggable({
           connectToSortable: ".sortable",
           helper: "clone",
           stop: function(event, ui) { $(this).draggable('disable') }
});