jQuery: Como parar um ajudante de ser removido se não foi removida com sucesso

Question

Eu tenho um draggable com um costume helper . Às vezes, o ajudante é um clone e às vezes é o elemento original.

O problema é que quando o ajudante é o elemento original e é não caiu em um droppable válida for removido. Minha solução olhares como este até agora:

Na minha on_dropped callback I set ui.helper.dropped_on_droppable para true;

No retorno stop do draggable, eu verifico para essa variável e então ... o que eu faço?

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

É este mesmo o caminho certo?

Answer 1

Ok, eu encontrei uma solução! É feio e quebra das regras de encapsulamento ", mas pelo menos ele faz o trabalho.

Lembre-se este é apenas para casos especiais ! jQuery pode lidar com sua própria remoção ajudante muito bem. No meu caso eu tinha um ajudante que às vezes era o elemento original e, por vezes, um clone, por isso não foi sempre conveniente suprimir a helper depois de reverter.

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;
        }
    },

AVISO: Este encapsulamento breaks e pode não ser para a frente compatível

Answer 2

Eu poderia estar faltando alguma coisa aqui, mas não é simplesmente um caso de adição

revert: "invalid"

para as opções do draggable se o draggable é de um elemento original, não um clone?

Answer 3

Eu uso um auxiliar personalizado que draggables agregados de múltipla seleção em uma única div. Este não parece jive com a funcionalidade revert então eu vim com este esquema. Os elementos são acrescentados manualmente de volta para o progenitor original que I acompanhar de via .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() );
    }
}

Esta abordagem não perder na animação bonita, mas pode ser útil para você ou alguém com esta questão.