Show TOC

Drag&Drop bei der Table Dieses Dokument in der Navigationsstruktur finden

 

Sie können selektierte Zeilen einer Table ziehen und Table-Zeilen, Images etc zwischen bereits existierenden Table-Zeilen fallen lassen. Dafür stehen die Aggregationen DRAG_SOURCE_INFO und DROP_TARGET_INFO sowie das Ereignis onDrop zur Verfügung.

Zusätzlich können Sie festlegen, dass das Droppen auf eine Zeile möglich ist. Dafür gibt es die Aggregation dropOnRowTargetInfo, die Eigenschaft dropOnRowName und die Eigenschaft DropTargetInfo.name.

Vorgehensweise zum Ermöglichen des Droppens auf eine Zeile
  1. Aggregieren Sie DropTargetInfos an die Table-Aggregation DROP_ROW_TRG_INFS.

  2. Vergeben Sie als DropTargetInfos.name verschiedene Werte. Wenn Sie eine DropTargetInfo in der Table-Aggregation DROP_TARGET_INFO wiederverwenden möchten, geben Sie auch dort einen Namen an.

  3. Setzen Sie die Eigenschaft Table.dropOnRowName.

    Der Wert muss entweder initial sein oder der Name einer der DropTargetInfos sein, die zu den Table-Aggregationen DROP_TARGET_INFO oder DROP_ROW_TRG_INFS gehören.

  4. Durch Context-Binding können Sie jeder Table-Zeile einen anderen Wert zuordnen und dadurch das unterschiedliche Drop-on-Row-Verhalten steuern.

    Hinweis Hinweis

    Wenn der Wert initial ist, ist kein Droppen auf eine Zeile möglich. Wenn der Wert dem Namen einer DropTargetInfo entspricht, dann legt diese DropTargetInfo das Droppen auf Table-Zeilen fest.

    Ende des Hinweises.

Beispiel Beispiel

Sie finden ein Beispiel in der Component WDR_TEST_DRAG_AND_DROP in der View Table. Photo album.

Dort können Sie kleine und große Images über Drag&Drop in eine Table einfügen. Sie können Bilder ersetzen, indem Sie Images auf eine Table-Zeile fallen lassen. Große Images können nur auf Zeilen mit großen Images und kleine Images nur auf Zeilen mit kleinen Images fallen gelassen werden.

Ende des Beispiels.
Drag&Drop in hierarchischen Tables

Für hierarchische Tabellen, also Tables mit Row-Arrangements TreeByKeyTableColumn oder TreeByNestingTableColumn gibt es zwei Modi.

Im einfachen Modus, d.h. wenn die folgenden Bedingungen erfüllt sind, kann man Objekte zwischen Tabellenzeilen fallen lassen und die DropTargetInfo der Table bestimmt global wie dies zu geschehen hat (d.h. sie bestimmt die tags:

  • Die Aggregation Table.dropOnRowTargetInfo ist leer

  • Die Eigenschaft Table.dropOnRowName ist initial

  • Die Eigenschaft DropTargetInfo.name des aggregierten Elementes in Table.dropTargetInfo ist initial

Sobald eine dieser Eigenschaften oder Aggregationen mit Werten gefüllt sind, gilt Folgendes für Drag&Drop bei der Table: Die DropTargetInfo in der Aggregation Table.dropTargetInfo kontrolliert das Einfügen über Drag&Drop lediglich auf dem Wurzelknoten, d.h. das Einfügen von Zeilen der obersten Hierarchieebene. Wie im vorigen Abschnitt beschrieben legt die Eigenschaft Table.dropOnRowName zusammen mit den an die Table aggregierten DropTargetInfos fest, ob und wie Elemente auf eine Table-Zeile fallen gelassen werden können. Zusätzlich legt die Eigenschaft Table.dropOnRowName und das dadurch bestimmte DropTargetInfo fest, ob und wie Elemente zwischen ihre Kindelemente eingefügt werden können.

Hinweis Hinweis

Beachten Sie, dass Sie die Ausprogrammierung der Funktionalität (also Einfügen, Umsortieren, etc.) immer selbst vornehmen müssen.

Ende des Hinweises.

Beispiel Beispiel

Sie finden ein Beispiel im System in der Component WDR_TEST_DRAG_AND_DROP in der View TableTreeByKey: More generic example. Dort werden zwei Tables angezeigt mit Schiffen, Containern und Gütern. Sie können Güter in Container und Container in Schiffe droppen, aber nicht Schiffe in Container oder in Güter. Sie können einen Container auf einer Zeile, die ein Schiff darstellt, fallen lassen, damit er am Ende der Containerliste des Schiffes eingefügt wird. Alternativ können Sie den Knoten öffnen, der das Schiff repräsentiert (indem Sie den Mauszeiger beim “Draggen” über das Dreiecksymbol für das Aufklappen der Kindelemente bewegen), und dann den Container zwischen einem der Kindelemente fallen lassen.

Ende des Beispiels.

Weitere Informationen

Dokumentation zu Drag&Drop