✔ jQuery: droppable(). Wie an das Element kommen, welches man hineingeschoben hat?

[ReoZeel]

Hallo,

ich habe noch eine Frage.
Ich habe zwei <div>-Container. Einer ist draggable(), der andere droppable().
Soweit sollte das klar sein.

Wenn ich jetzt den draggable()-div in den droppable()-div schiebe, dann kann ich mittels:

$("#droppable").droppable({
drop: function(event, ui) {
... meine funktion ...
} });

dafür sorgen, dass bei ... meine funktion .... passiert, was ich möchte. Ich kann z.B. div-droppable mittels options auf disable stellen. Das funktioniert auch soweit.

Wie komme ich aberi n diesem Bereich dann an das draggble()-Item?

Wenn ich z.B. zwei div-Container habe, wie erkenne ich welcher von beiden reingeschoben wurde und kann dann in der "drop-Methode" auf diesen zugreifen?

Ich hoffe, dass ihr verstanden habt, was ich brauche.


Gruß,
Reo

 

[Sven Mintel]

Moin Reo,

Ich hoffe, dass ihr verstanden habt, was ich brauche.

vermutlich meinst du event.target

Kurzer Test:

$("#droppable").droppable({
  drop: function(event, ui) {
    alert($(event.target).attr('id'));
} });

...sollte "droppable" ausgeben.

 

[ReoZeel]

Hallo,

erstmal vielen Dank für Deine Hilfe. Leider ist das genau das "umgekehrte" von dem, was ich möchte.
Ich bekomme damit die ID des Feldes, auf das ist geschoben habe.

Ich brauche aber die ID (oder irgendwas anderes) von dem Element, welches ich IN das Feld reingeschoben haben.

Also ich habe 3 draggables.
Drag 1
Drag 2
Drag 3

Ich habe 1 Droppable

Ich möchte jetzt eines der 3 Drag-Felder in das Droppable schieben. Wie finde ich herraus, welches ich reingeschoben habe?

 

[Sven Mintel]

in dem Fall müsstest du das Ganze statt über den drop-Event des #droppable über den stop-Event des #draggable machen.

Zugriff wäre derselbe, per event.target oder auch einfach per this

 

[ReoZeel]

Ja, ich habe ne Lösung gefunden. Nicht das, was Du als zweites gesagt hattest, aber der erste Hinweis hat mich dann zur Lösung geführt (zusammen mit der jQuery-Doku)

Hier meine Lösung, falls es später auch andere brauchen.

$("#droppable").droppable({
  drop: function(event, ui) {
    alert($(ui.draggable).attr('id'));
} });

Ich danke Dir vielmals für die Hilfe, das hat mir auf jeden Fall sehr weitergeholfen. Ich bin sicher, dass es auch über die Stop-Methode des Draggable geht, aber so ist es doch sehr angenehm.