jQuery: как предотвратить удаление помощника, если он не был успешно удален

Question

У меня есть draggable с пользовательским helper. Иногда помощник - это клон, а иногда - оригинальный элемент.

Проблема в том, что когда помощник является исходным элементом и не отброшен на допустимом отбрасывании, он удаляется. Мое решение выглядит так:

в моем on_dropped обратном вызове я установил ui.helper.dropped_on_droppable на true;

В обратном вызове stop draggable я проверяю эту переменную и затем ... что мне делать?

$('.my_draggable').draggable({
    stop   : function(e, ui) {
        if (!ui.helper.dropped_on_droppable) {
            /* what do I do here? */
        }
    },

Это даже правильный подход?

Answer 1

Хорошо, я нашел решение! Это уродливо и нарушает «правила инкапсуляции», но, по крайней мере, оно делает свою работу.

Помните это только для особых случаев ! JQuery прекрасно справляется с удалением своего помощника. В моем случае у меня был помощник, который иногда был исходным элементом, а иногда клоном, поэтому не всегда было целесообразно удалять помощника после возврата.

element.draggable({
    stop   : function(e, ui) {
        /* "dropped_on_droppable" is custom and set in my custom drop method
           ".moved_draggable" is custom and set in my custom drag method, 
                     to differentiate between the two types of draggables
        */               
        if (!ui.helper.dropped_on_droppable & ui.helper.hasClass('moved_draggable')) {
            /* this is the big hack that breaks encapsulation */
            $.ui.ddmanager.current.cancelHelperRemoval = true;
        }
    },

Предупреждение: это нарушает инкапсуляцию и может быть несовместимо

Answer 2

Я использую пользовательский помощник, который объединяет перетаскиваемые объекты с множественным выбором в один div. Похоже, это не соответствует функциональности возврата, поэтому я придумал эту схему. Элементы добавляются вручную к исходному родительскому элементу, который я отслеживаю с помощью .data ().

.draggable({
    helper: function() {
        var div = $(document.createElement('div'))
            .data('lastParent', $(this).parent());
        return div;
    },
    start: function() {
        //... add multiple selection items to the helper..          
    },
    stop: function(event,ui) {
        $( $(ui.helper).data('lastParent') ).append( $(ui.helper).children() );
    }
}

Этот подход проигрывает на красивой анимации, но может быть полезен вам или кому-то еще с этой проблемой.

Answer 3

Я мог бы что-то упустить здесь, но это не просто случай добавления

revert: "invalid"

к параметрам перетаскиваемого объекта, если перетаскиваемый элемент имеет оригинальный элемент, а не клон?