jQuery: come impedire che un helper venga rimosso se non è stato eliminato correttamente

Question

Ho un trascinabile con un helper . A volte l'helper è un clone e talvolta è l'elemento originale.

Il problema è che quando l'helper è l'elemento originale e non rilasciato su un droppable valido, viene rimosso. Finora la mia soluzione è così:

nel mio on_dropped callback ho impostato ui.helper.dropped_on_droppable su true ;

Nel callback stop del trascinabile, cerco quella variabile e poi ... cosa devo fare?

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

È forse questo l'approccio giusto?

Answer 1

Ok, ho trovato una soluzione! È brutto e infrange le "regole dell'incapsulamento", ma almeno fa il suo lavoro.

Ricorda questo è solo per casi speciali ! jQuery è in grado di gestire bene la propria rimozione dell'helper. Nel mio caso avevo un helper che a volte era l'elemento originale e talvolta un clone, quindi non era sempre appropriato eliminare l'helper dopo il ripristino.

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

Avviso: interrompe l'incapsulamento e potrebbe non essere compatibile in avanti

Answer 2

Potrei mancare qualcosa qui, ma non è semplicemente un caso di aggiunta

revert: "invalid"

alle opzioni del trascinabile se il trascinabile è di un elemento originale, non di un clone?

Answer 3

Uso un helper personalizzato che aggrega trascinabili a selezione multipla in un unico div. Questo non sembra adattarsi alla funzionalità di ripristino, quindi ho ideato questo schema. Gli elementi vengono aggiunti manualmente al genitore originale di cui tengo traccia tramite 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() );
    }
}

Questo approccio perde la bella animazione, ma può essere utile a te o a qualcun altro con questo problema.