JQuery UI: перетаскиваемый элемент теряет способность перетаскивать/удалять после клонирования

Question

У меня есть некоторые div, которые пользователь может переместить в target-div. Если они будут сброшены, там будет добавлен новый div. Но теперь пользователь должен иметь возможность делать это снова и снова. Но после того, как клон был сброшен (где бы то ни было - не только в droppable), исходный элемент теряет способность падать. Как я могу изменить его, чтобы пользователи могли перемещать исходный элемент много раз в target-div?

В следующем коде показан пример сценария, который работает exakt 1 раз. После одной капли первая часть больше не работает. Я попытался добавить эту функцию снова после отказа без успеха.

$('.move-me').draggable({ 
    revert: "invalid", 
    helper: "clone" 
    }); 

    $('#target').droppable({ 
    accept: '.move-me', 
    drop: function (event, ui) { 
     $(this).append('<div>You dropped an element here</div>'); 
    } 
    }); 

Answer 1

Я только что изменил свой код с возможностью замены. Пожалуйста, проверьте один раз.

$('.move-me').draggable({ 
    revert: "invalid", 
    helper: "clone", 
    cursor : "move", 
    }); 

    $('#target').droppable({ 
    accept: '.move-me', 
    drop: function (event, ui) { 
// Make sure you are cloning your draggable and use that div to modify as per your requirement 
    var html = $(ui.draggable).clone(true); 
    ui.draggable.draggable('enable'); 
     $(this).append('<div>You dropped an element here</div>'); 
    } 
    }); 

Рад, если это сработает.

Answer 2

У меня была та же проблема. Я отсортировал этот вопрос, обновив правило css. Я отбрасывал элемент в div, у которого был более высокий индекс z, чем выпавший элемент. Я просто добавил класс и установил значение z-index больше, чем значение контейнера drop. Это решило мою проблему.

Надеюсь, это поможет, если какой-либо из вышеперечисленных ответов не сработает.

Answer 3

Я знаю, что это немного поздно, но кажется, что если вы снова вызовете draggable(), он должен находиться вне функции готовности документа. Я перешел за пределы готовой функции, когда я снова ее назвал, и это сработало как шарм.