Drag & Drop in Web Dynpro Java
Drag & Drop als Funktion kommt bei Benutzern immer gut an - es ist einfach, intuitiv und schnell in der Anwendung. In webbasierten SAP Applikationen ist diese Technik immer noch nicht sehr verbreitet. Eigentlich zu Unrecht, denn auch die Implementierung, zum Beispiel mit Web Dynpro Java, ist nicht schwer. Dieser Artikel zeigt wie es geht.
Schritt für Schritt Anleitung: Drag and Drop in Web Dynpro Java
Wir haben bereits ein Projekt im SAP NetWeaver Developer Studio (NWDS), eine entsprechende Applikation sowie dazugehörige Komponenten und Kontexte.
Im ersten Schritt erstellen wir uns zwei Tabellen. Die erste wird die Quelltabelle, aus der wir die Daten in die zweite, die Zieltabelle, übergeben wollen. Dazu wählen wir aus dem Kontextmenü, des entsprechenden Gruppenelements Apply Template und fügen nach und nach die Tabellen ein und binden sie an die Kontexte.
Tabellen in Apply Template einbauen
Schritt 2: Jetzt fügen wir in unsere Quelltabelle eine DragSourceInfo ein. D.h. wir wählen aus dem Kontextmenü der Quelltabelle Insert -> DragSourceInfo aus
DragSourceInfo in Quelltabelle einfügen
In der Zieltabelle wählen wir aus dem Kontextmenü Insert -> DropTargetInfo aus.
Zieltabelle: Insert -> DropTargetInfo
In den Eigenschaften der jeweiligen DragSourceInfo bzw. DropTargetInfo müssen wir den Tag gleich setzen. In diesem Fall heißt der Tag bei beiden “Favorites”. Dies garantiert eine eindeutige Zuordnung.
Tag setzen in DragSourceInfo bzw. DropTargetInfo
Jetzt müssen wir nur noch sagen, was eigentlich gedropped werden soll, wenn man einen Eintrag in die Zieltabelle zieht. Dazu gehen wir auf die Eigenschaften unserer Zieltabelle in der View. Unter Events wählen wir die Aktion onDrop aus. Mit create können wir eine neue Funktion erstellen.
Neue Funktion mit onDrop und create erstellen
Zeit für eine kleine Zwischenspeicherung 😉
Mit Hilfe von Go können wir nun gleich in den Code an die richtige Stelle springen. Hier fügen wir nun all das ein, was wir aus unserer Quelltabelle in der Zieltabelle haben wollen. In diesem Fall wollen wir nur die Nummer und die Beschreibung als zusammenhängenden String haben. Dazu lesen wir zunächst den entsprechenden Eintrag aus und setzen dann den neuen für die Zieltabelle.
Eintrag auslesen und neuen setzen
Nach builden und deployen sieht die Anwendung in etwa so aus:
Ansicht nach build und deploy (1)
Ansicht nach build und deploy (2)
Viel Spaß beim Selberbauen! Für Anregungen und Kritik bin ich dankbar. Falls Sie Fragen haben, dann scheuen Sie sich nicht, mir ebenfalls einen Kommentar zu hinterlassen.
