Droptarget bei Drag&Drop ermitteln

[Christian Wichmann]

Hallo,

mein Problem ist zwar schon einige Male im Forum aufgetaucht, aber eine zufriedenstellende Lösung habe ich im Archiv leider nicht gefunden.

Problem: Ich möchte - am besten auf Basis der in http://aktuell.de.selfhtml.org/tippstricks/dhtml/draganddrop/index.htm beschriebenen Lösung - ein Drag&Drop von verschiedenen <div>-Bereichen realisieren. Allerdings muss ich zusätzlich ermitteln können, auf welchem <div>-Element der Drag&Drop-Vorgang beendet wurde. Beispielhaft müsste eine alert()-Ausgabe wie "Objekt A wurde auf Objekt B fallen gelassen" möglich sein.

Hintergrund: Ich baue eine hierarchisch in Kategorien organisierte Artikeldatenbank (PHP/MySQL) auf. Als Übersicht habe ich eine dynamisch auf- und zuklappbare Kategorien-Artikel-Baumstruktur. Das funktioniert so weit alles ganz prima. Als i-Tüpfelchen wünsche ich mir jetzt noch, dass man Kategorien und Artikel per Drag&Drop in andere Kategorien verschieben kann. Anstelle der oben beschriebenen alert()-Ausgabe wird dann natürlich ein PHP-Skript aufgerufen, das die entsprechende Verschiebung in der Datenbank vornimmt.

Naiver Ansatz: Am einfachsten wäre es, das mouseup-Event nicht ausschließlich global zu behandeln, sondern derart, dass jedes <div>, auf das gedroppt werden kann, ein eigenes mouseup-Event hat. Da gibt es aber zwei neue Probleme: Erstens feuern dann sowohl das "lokale" als auch das "globale" mouseup-Event (was jedoch nicht so schlimm ist). Zweitens wird dummerweise das mouseup-Event immer von dem <div> ausgelöst, welches ich gedroppt habe, und nicht von dem, auf das ich gedroppt habe. Ich habe daraufhin den z-index des jeweils gedraggten <div> derart angepasst, dass es sich _hinter_ allen anderen <div>-Bereichen befindet. Die Hoffnung war, dass so auf jeden Fall das <div>, auf das gedroppt wurde, das mouseup-Event auslöst. Leider führte auch das nicht zum gewünschten Ergebnis.

Wenn mir jemand eine Lösung oder Lösungshinweise geben könnte, wäre ich sehr dankbar. Falls erforderlich, kann ich gerne noch ein ausführliches Codebeispiel posten.