2011-01-13 17 views
5

Das gewünschte Verhalten:Hinzufügen von Droppables beim Ziehen von Draggable

Der Benutzer zieht ein Element auf einen Baum. Beim Schweben über einen geschlossenen Knoten expandiert der Knoten und gibt die Kinder frei. An diesem Punkt kann der Benutzer weiter zu den untergeordneten Knoten ziehen und einen von ihnen ablegen.

Das war in Ordnung. Ich verwende die "over" -Option der Droppables, um den Knoten zu erweitern und die Child-Objekte ablegen zu lassen.

Aber ich musste einige weitere Funktionen hinzufügen. Zuerst habe ich einen Helfer für ziehbare Sachen hinzugefügt. Funktioniert immer noch gut. Dann lege ich die Draggables und Droppables in zwei verschiedene Container (divs). An diesem Punkt würde der Helfer nicht aus dem Container herausziehen. Die Lösung bestand darin, "appendTo: 'body'" auf den Draggables zu setzen. Alles gut ... nun, nicht ganz.

Jetzt sind die untergeordneten Knoten nicht während des aktuellen Ziehvorgangs abtropfbar. Der Benutzer muss das aktuelle Ziehen und Redrag in den gewünschten untergeordneten Knoten freigeben. Wenn ich die appendTo -Option entferne, verschwindet das Problem, aber dann bewegt sich der Helfer nicht visuell in den abwerfbaren Container.

Gibt es einen Weg, wie ich diese neuen Droppables "aufwecken" kann, damit sie sofort ablegen können?

Antwort

6

So habe ich fast das gleiche Problem gelöst. In meinem Fall, wenn ich den Knoten beim Ziehen eines ziehbaren Objekts öffne, werden untergeordnete Elemente über Ajax geladen und dann als Drop-Variablen initialisiert. Dann habe ich dies zu tun:

ui.draggable.draggable('option', 'refreshPositions', true); 
var tempFunc = function() { 
    if (ui.draggable) { 
     ui.draggable.off('drag', tempFunc); 
     setTimeout(function() { 
      ui.draggable.draggable('option', 'refreshPositions', false); 
     }, 100); 
    } 
}; 
ui.draggable.on('drag', tempFunc); 

Dies macht die ziehbar haben refreshPositions Option als true lang genug, um für die neuen droppables den aktuellen Widerstand zu verbinden. Sie können die Option refreshPositions während des gesamten Ziehens auch true haben, aber es gibt eine Leistungseinbuße, die ich nicht möchte.

Ich habe keinen Weg gefunden, es auf andere Weise zu tun. Es wäre am besten, wenn es eine Methode gäbe, die Sie während des Ziehens nur zum Aktualisieren der Positionen aufrufen könnten, aber nicht.

Verwandte Themen