Kaskadierende Dropdown-Listen

Eine Dropdown-Liste für die Kaskadierung ist eine Reihe von abhängigen DropDownList-Steuerelementen, in denen ein DropDownList-Steuerelement vom übergeordneten oder vorherigen DropDownList-Steuerelement abhängt. Die Elemente im DropDownList-Steuerelement werden basierend auf einem Element gefüllt, das vom Benutzer aus einem anderen DropDownList-Steuerelement ausgewählt wird.

Nachweis des Anwendungsfalls

Im Rahmen dieses Tutorials habe ich Geonames REST API , um diese Funktion zu demonstrieren.
Es gibt eine Reihe von Organisationen, die diese Art von Dienst bereitstellen. Solange sie über gut dokumentierte REST-APIs verfügen, können Sie mit der Datenintegrationsfunktion einfach in AEM Forms integrieren

Die folgenden Schritte wurden ausgeführt, um kaskadierende Dropdown-Listen in AEM Forms zu implementieren

Entwicklerkonto erstellen

Erstellen Sie ein Entwicklerkonto mit Geonames. Notieren Sie sich den Benutzernamen. Dieser Benutzername ist erforderlich, um REST-APIs der geonames.org aufzurufen.

Erstellen der Swagger/OpenAPI-Datei

Die OpenAPI-Spezifikation (früher Swagger Specification) ist ein API-Beschreibungsformat für REST-APIs. Mit einer OpenAPI-Datei können Sie Ihre gesamte API beschreiben, einschließlich:

  • Verfügbare Endpunkte (/users?lang=de) und Vorgänge für jeden Endpunkt (GET /users, POST /users)
  • Aktionsparameter Eingabe und Ausgabe für jede Vorgangsauthentifizierungsmethode
  • Kontaktinformationen, Lizenz, Nutzungsbedingungen und sonstige Informationen.
  • API-Spezifikationen können in YAML oder JSON geschrieben werden. Das Format ist für Menschen und Maschinen leicht zu erlernen und lesbar.

Um Ihre erste Swagger/OpenAPI-Datei zu erstellen, folgen Sie dem OpenAPI-Dokumentation

HINWEIS

AEM Forms unterstützt OpenAPI Specification Version 2.0 (FKA Swagger).

Verwenden Sie die Swagger-Editor um Ihre Swagger-Datei zu erstellen, um die Vorgänge zu beschreiben, die alle Länder und untergeordneten Elemente des Landes oder Staates abrufen. Die Swagger-Datei kann im JSON- oder YAML-Format erstellt werden. Die fertige Swagger-Datei kann von heruntergeladen werden. here
Die Swagger-Dateien beschreiben die folgende REST-API

Data Sources erstellen

Um AEM/AEM Forms mit Drittanbieteranwendungen zu integrieren, müssen wir Datenquelle erstellen in der Cloud-Services-Konfiguration. Bitte verwenden Sie Swagger-Dateien , um Ihre Datenquellen zu erstellen.
Sie müssen zwei Datenquellen erstellen (eine zum Abrufen aller Länder und eine andere zum Abrufen untergeordneter Elemente).

Erstellen von Formulardatenmodellen

Die AEM Forms-Datenintegration bietet eine intuitive Benutzeroberfläche zum Erstellen und Verwenden von Formulardatenmodelle. Stützen Sie das Formulardatenmodell auf die Datenquellen, die im vorherigen Schritt erstellt wurden. Formulardatenmodell mit 2 Datenquellen

fdm

Adaptives Formular erstellen

Integrieren Sie die GET Aufrufe des Formulardatenmodells in Ihr adaptives Formular, um die Dropdown-Listen zu füllen.
Erstellen Sie ein adaptives Formular mit 2 Dropdownlisten. Eins zur Auflistung der Länder und eins zur Auflistung der Bundesländer/-provinzen je nach Land.

Die Länderliste wird ausgefüllt, wenn das Formular zum ersten Mal initialisiert wird. Der folgende Screenshot zeigt den Regeleditor, der zum Ausfüllen der Optionen der Dropdown-Liste "Land"konfiguriert ist. Dazu müssen Sie Ihren Benutzernamen mit dem Geonames-Konto angeben.
get-countries

Füllen der Dropdownliste Bundesland/Provinz

Die Dropdown-Liste Bundesland muss auf der Grundlage des ausgewählten Landes ausgefüllt werden. Der folgende Screenshot zeigt die Konfiguration des Regeleditors
state-provinze-options

Übung

Fügen Sie im Formular 2 Dropdownlisten mit dem Namen "Counties and Cities"hinzu, um je nach ausgewähltem Land und Bundesland die Bezirke und Städte aufzulisten.
Übung

Auf dieser Seite