Web AppBuilder: Daten zwischen Widgets austauschen
In manchen Fällen hat man die Anforderung, dass man in einem Widget auf Informationen eines anderen Widgets zugreifen muss. Dann stellt sich
die Frage, wie man die Daten aus dem einen Widget für ein anderes Widget verfügbar machen kann.
Für diesen Anwendungsfall verfügt ein Widget über die Funktionen publishData(), fetchData(), fetchDataByName(), onReceiveData() und onNoData(). Diese Funktionen übernimmt ein eigenes Widget automatisch von BaseWidget.
Um die Verwendung dieser Funktionen besser zu verstehen, schauen wir uns dies an einem ganz einfachen Beispiel mit zwei Widgets an. Das
erste Widget mit Namen SetLocation dient zur Eingabe einer X/Y-Koordinate, auf die die Karte zentriert werden kann:
Das zweite Widget mit Namen GetLocation soll einfach diese X/Y-Koordinate wieder anzeigen:
Wie kommen nun die Koordinatenwerte in das zweite Widget?
In dem Widget, das die Daten sendet, also SetLocation, werden die Koordinatenwerte in zwei Input-Felder eingetragen und in einer Funktion,
die über das Anklicken des Buttons aufgerufen wird, ausgelesen. Wenn man mehrere Einzeldaten hat, kann man diese dann z.B. in einem JSON-String zusammenfassen. Um diese Daten nun für andere Widgets verfügbar zu machen, wird die Funktion publishData() aufgerufen und dieser die Daten übergeben:
In dem Widget, das die Daten empfangen soll, also in GetLocation, werden die Daten mit der Funktion fetchData(widgetId) abgerufen.
Die Funktion kann z.B. in der Methode startUp() aufgerufen werden:
Der Parameter widgetId ist dabei die ID des Widgets, das die Daten sendet (hier SetLocation), so wie sie in der Konfigurationsdatei config.json
der App eingetragen wurde.
Sind Daten zum Empfang vorhanden, so werden diese in der Eventhandler-Funktion onReceiveData() zur Verfügung gestellt, die man in dem
empfangenden Widget bereitstellen muss. Sind keine Daten vorhanden, wird die Eventhandler-Funktion onNoData() aufgerufen.
In der Funktion onReceiveData() werden die übertragenen Daten als Parameter übergeben, sodass man sie hier verwenden kann, z.B. um sie
in dem Widget anzuzeigen.
Zusammenfassend noch einmal der Ablauf:
1) Im sendenden Widget die Daten mit der Funktion publishData() bereitstellen.
2) Im empfangenden Widget die Daten über die Funktion fetchData() abfragen und in der Funktion onReceiveData() auslesen und verwenden.
Happy coding!