Erstellen eines adaptiven Formulars

Letzte Aktualisierung: 2023-11-24
  • Erstellt für:
  • Beginner
    User
    Developer
Version Artikel-Link
AEM 6.5 Hier klicken
AEM as a Cloud Service Dieser Artikel

Mit adaptiven Formularen können Sie Formulare erstellen, die ansprechend, reaktionsfähig, dynamisch und anpassungsfähig sind. AEM Forms bietet eine Business-Anwender-freundliche Assistenz für die schnelle Erstellung adaptiver Formulare. Der Assistent bietet eine schnelle Registerkartennavigation, mit der Sie einfach vorkonfigurierte Vorlagen, Stile, Felder und Übermittlungsoptionen auswählen können, um ein adaptives Formular zu erstellen.

Bevor Sie beginnen, erfahren Sie mehr über die Arten der Formular-Komponenten, die Ihnen zur Verfügung stehen:

  • Kernkomponenten adaptiver Formulare: Dies sind standardisierte Datenerfassungskomponenten. Diese Komponenten bieten Anpassungsfunktionen, kürzere Entwicklungszeiten und niedrigere Wartungskosten für Ihre Erlebnisse bei der digitalen Registrierung. Entwickelnde können diese Komponenten einfach anpassen und gestalten. Adobe empfiehlt die Verwendung dieser modernen und erweiterbaren Komponenten zur Entwicklung von Adaptive Forms.

  • Foundation-Komponenten adaptiver Formulare: Hierbei handelt es sich um klassische (alte) Datenerfassungskomponenten. Sie können diese weiterhin verwenden, um Ihre vorhandenen Foundation-Komponenten auf Grundlage des adaptiven Formulars zu bearbeiten. Wenn Sie neue Formulare erstellen, empfiehlt Adobe die Verwendung von Kernkomponenten von adaptiven Formularen, um ein adaptives Formular zu erstellen.

Assistent zum Erstellen eines adaptiven Formulars

Voraussetzungen

Zum Erstellen eines adaptiven Formulars benötigen Sie Folgendes:

  • Aktivieren der adaptiven Forms-Kernkomponenten für Ihre Umgebung: Wenn Sie ein Programm erstellen, sind die adaptiven Forms-Kernkomponenten bereits für Ihre Umgebung aktiviert. Wenn Sie eine Forms as a Cloud Service-Umgebung basierend auf Archetyp 39 oder früher haben, aktivieren Sie die Kernkomponenten von adaptiven Formularen für Ihre Umgebung. Sobald Sie die Kernkomponenten für Ihre Umgebung aktivieren, werden die Vorlage und das Arbeitsflächen-Design für adaptive Formulare (Kernkomponente) zu Ihrer Umgebung hinzugefügt. Wenn Ihre AEM SDK-Version älter als 2023.02.0 ist, stellen Sie sicher, dass das prerelease-Flag in Ihrer Umgebung aktiviert ist, da Kernkomponenten für adaptive Formulare Teil der Vorabversion vor der Version 2023.02.0 waren.

  • Eine adaptive Formularvorlage: Eine Vorlage liefert eine Grundstruktur und definiert das Erscheinungsbild (Layouts und Stile) eines adaptiven Formulars. Es enthält vorformatierte Komponenten einschließlich bestimmter Eigenschaften und einer Struktur für Inhalte. Es bietet außerdem die Optionen zum Definieren eines Designs und einer Übermittlungsaktion. Das Design definiert den Look-and-Feel und die Übermittlungsaktion definiert die Aktion, die bei der Übermittlung eines adaptiven Formulars ausgeführt werden soll. Senden der erfassten Daten an eine Datenquelle. Der Cloud-Service bietet eine OOTB-Vorlage mit leerem Namen:

    • Die Vorlage blank ist in jedem neuen AEM Forms as a Cloud Service-Programm enthalten.
    • Sie können das Referenzpaket über Package Manager installieren, um die Vorlage blank zu Ihrem AEM Forms as a Cloud Service-Programm hinzuzufügen.
    • Sie können auch Erstellen einer adaptiven Forms-Vorlage (Kernkomponenten) von Grund auf neu.
    • Sie können auch Beispielvorlagen in Ihre Umgebung implementieren. Diese helfen Ihnen dabei, Formulare schnell zu erstellen.

  • Ein adaptives Formular: Ein Design enthält Stildetails für die Komponenten und Bedienfelder. Die Stile umfassen Eigenschaften wie Hintergrundfarben, Statusfarben, Transparenz, Ausrichtung und Größe. Wenn Sie ein Design anwenden, spiegeln die entsprechenden Komponenten den angegebenen Stil wider. Die Vorlage Canvas ist in jedem neuen AEM Forms as a Cloud Service-Programm enthalten. Sie können auch Beispiel-Designs in Ihre Umgebung implementieren. Diese helfen Ihnen dabei, mit der Formatierung Ihrer Formulare zu beginnen und eine Basisstruktur bereitzustellen, mit der Sie ein Design gemäß Ihren Geschäftsanforderungen erstellen oder anpassen können.

  • Berechtigungen: Fügen Sie Ihre Benutzerinnen und Benutzer zur Gruppe forms-users hinzu. Die Mitglieder der forms-users-Gruppe sind berechtigt, ein adaptives Formular zu erstellen. Eine detaillierte Liste der formularspezifischen Benutzergruppen finden Sie unter Gruppen und Berechtigungen.

Erstellen eines adaptiven Formulars

  1. Melden Sie sich bei Ihrer Experience Manager Forms-Autoreninstanz an. Dabei kann es sich um eine Cloud-Instanz oder eine lokale Entwicklungsinstanz handeln.

  2. Geben Sie Ihre Anmeldedaten auf der Experience Manager-Anmeldeseite ein. Wenn Sie sich angemeldet haben, tippen Sie in der oberen linken Ecke auf Adobe Experience Manager > Formulare > Formulare und Dokumente.

  3. Tippen Sie auf Erstellen > Adaptives Formular. Der Assistent wird geöffnet. Wählen Sie auf der Registerkarte „Quelle“ eine Vorlage aus:

    Kernkomponentenvorlage

    Wenn Sie eine Vorlage auswählen, werden ein Design und eine in der Vorlage angegebene Sendeaktion automatisch ausgewählt und die Schaltfläche Erstellen wird aktiviert. Sie können zu den Registerkarten Stil oder Übermittlung gehen, um ein anderes Design oder eine andere Übermittlungsaktion auszuwählen. Wenn in der ausgewählten Vorlage kein Design angegeben wird, bleibt die Schaltfläche „Erstellen“ deaktiviert. Sie können zur Registerkarte Stile gehen, um ein Design manuell auszuwählen.

    HINWEIS

    Wenn Sie über keine Vorlage für adaptive Formulare (Kernkomponente) in Ihrer Umgebung verfügen, aktivieren Sie die Kernkomponenten für adaptive Formulare für Ihre Umgebung. Sobald Sie die Kernkomponenten für Ihre Umgebung aktivieren, wird die Vorlage für adaptive Formulare (Kernkomponente) zu Ihrer Umgebung hinzugefügt.

  4. Wählen Sie auf der Registerkarte Stil ein Design aus:

    • Wenn die ausgewählte Vorlage ein Design angibt, wird das Design automatisch im Assistenten ausgewählt. Sie können auch auf der Registerkarte „Stil“ ein anderes Design auswählen.

    • Wenn in der ausgewählten Vorlage kein Design angegeben ist, können Sie auf der Registerkarte „Stil“ ein Design auswählen. Die Erstellen-Schaltfläche wird erst aktiviert, nachdem ein Design ausgewählt wurde.

  5. (Optional) Wählen Sie auf der Registerkarte „Daten“ ein Datenmodell aus:

    • Formulardatenmodell: Ein Formulardatenmodell ermöglicht Ihnen die Integration von Entitäten und Diensten aus unterschiedlichen Datenquellen in ein adaptives Formular. Wählen Sie das Formulardatenmodell, wenn Sie ein adaptives Formular erstellen, für das Daten aus mehreren Datenquellen abgerufen und in sie geschrieben werden sollen.

    • JSON-Schema: JSON-Schema Unser auf Kernkomponenten basierendes adaptives Formular ermöglicht eine nahtlose Integration in das Backend-System Ihres Unternehmens, indem es die Möglichkeit bietet, ein JSON-Schema zu verknüpfen, das die Struktur der erzeugten oder verwendeten Daten darstellt. Diese Zuordnung ermöglicht es Autorinnen und Autoren, dem adaptiven Formular mithilfe der Elemente des Schemas dynamisch Inhalte hinzuzufügen. Die Elemente des Schemas sind während des Authoring-Prozesses auf der Registerkarte Datenmodellobjekte des Inhalts-Browsers leicht zugänglich. Alle Felder werden automatisch zu jedem erstellten adaptiven Formular hinzugefügt.

    Standardmäßig werden alle Felder des zugehörigen JSON-Schemas automatisch ausgewählt und in entsprechende adaptive Formularkomponenten konvertiert, was den Erstellungsprozess vereinfacht. Der Assistent bietet einen zusätzlichen Komfort, mit dem Sie mithilfe von Kontrollkästchen selektiv festlegen können, welche Felder in das adaptive Formular aufgenommen werden sollen.

  6. Wählen Sie auf der Registerkarte Übermittlung eine Übermittlungsaktion aus:

    • Wenn Sie eine Vorlage auswählen, wird die in der Vorlage angegebene Übermittlungsaktion automatisch ausgewählt. Sie können auf der Registerkarte „Übermittlung“ eine andere Übermittlungsaktion auswählen. Auf der Registerkarte Übermittlung werden alle verfügbaren Übermittlungsaktionen angezeigt.

    • Wenn die ausgewählte Vorlage keine Übermittlungsaktion angibt, können Sie auf der Registerkarte Übermittlung eine Übermittlungsaktion auswählen

  7. (Optional) Auf der Registerkarte Versand können Sie ein Datum für die Veröffentlichung oder das Rückgängigmachen der Veröffentlichung eines adaptiven Formulars angeben.

  8. Tippen Sie auf Erstellen. Es wird ein Dialogfeld angezeigt, in dem Sie den Titel, Namen und Speicherort des adaptiven Formulars angeben können:

    • Titel: Gibt den Anzeigenamen des Formulars an. Der Titel erleichtert Ihnen die Identifizierung des Formulars in der Benutzeroberfläche von Experience Manager Forms.
    • Name: Gibt den Namen des Formulars an. Im Repository wird ein Knoten mit dem angegebenen Namen erstellt. Wenn Sie mit der Eingabe des Titels beginnen, wird automatisch ein Wert für das Feld „Name“ vorgeschlagen. Sie können den vorgeschlagenen Wert gegebenenfalls ändern. Im Feld „Name“ dürfen nur alphanumerische Zeichen, Bindestriche und Unterstriche eingegeben werden. Alle ungültigen Eingaben werden durch Bindestriche ersetzt.
    • Pfad: Gibt den Speicherort an, an dem das adaptive Formular gespeichert werden soll. Sie können das adaptive Formular direkt unter /content/dam/formsanddocuments erstellen oder einen Ordner wie /content/dam/formsanddocuments/adaptiveforms anlegen, um ein adaptives Formular zu speichern. Stellen Sie sicher, dass Sie den Ordner erstellen, bevor Sie ihn im Pfad verwenden. Das Feld Pfad erstellt nicht automatisch einen Ordner.

  9. Tippen Sie auf Erstellen. Ein adaptives Formular wird erstellt und im Editor für adaptive Formulare geöffnet. Der Editor zeigt die in der Vorlage verfügbaren Inhalte an. Je nach Typ des adaptiven Formulars werden auf der Registerkarte Datenmodellobjekte des Content-Browsers in der Seitenleiste die Formularelemente angezeigt, die im zugewiesenen -JSON-Schema oder Formulardatenmodell vorhanden sind. Sie können diese Elemente auch per Drag-and-Drop in das zu erstellende adaptive Formular ziehen.

Jetzt können Sie die Kernkomponenten für adaptive Formulare per Drag-and-Drop in den Container für adaptive Formulare ziehen, um das Formular zu entwerfen und zu erstellen. Sie können auch https://aemcomponents.dev/ besuchen, um die verfügbaren Kernkomponenten in Aktion zu sehen.

Konfigurieren der Übermittlungsaktion für ein adaptives Formular

Mit einer Übermittlungsaktion können Sie das Ziel der Daten auswählen, die über ein adaptives Formular erfasst werden. Eine Übermittlungsaktion wird ausgelöst, wenn eine Benutzerin bzw. ein Benutzer in einem adaptiven Formular auf die Schaltfläche „Senden“ klickt. Adaptive Formulare enthalten einige vordefinierte Sendeaktionen. Sie können außerdem die standardmäßigen Sendeaktionen erweitern, um Ihre eigene benutzerdefinierte Sendeaktion zu erstellen. So konfigurieren Sie eine Sendeaktion für Ihr Formular:

  1. Öffnen Sie den Inhalts-Browser und wählen Sie die Guide-Container-Komponente Ihres adaptiven Formulars aus.

  2. Klicken Sie auf das Symbol für die Guide-Container-Eigenschaften Guide-Eigenschaften. Das Dialogfeld „Container für ein adaptives Formular“ wird geöffnet.

  3. Klicken Sie auf die Registerkarte Übermittlung.

    Klicken Sie auf das Schraubenschlüsselsymbol, um das Dialogfeld „Container für ein adaptives Formular“ zu öffnen und eine Übermittlungsaktion zu konfigurieren.

  4. Wählen Sie basierend auf Ihren Anforderungen eine Übermittlungsaktion aus und konfigurieren Sie sie. Detaillierte Informationen zu Übermittlungsaktionen finden Sie unter Übermittlungsaktion für adaptive Formulare

Leiten Sie bei der Formularübermittlung die Benutzenden auf eine Seite um oder zeigen Sie eine Dankesnachricht an

Beim Senden eines Formulars können Sie die Benutzenden zu einer anderen Web-Seite oder Nachricht umleiten. So leiten Sie die Benutzenden um oder konfigurieren die Dankesnachricht:

  1. Öffnen Sie den Inhalts-Browser und wählen Sie die Guide-Container-Komponente Ihres adaptiven Formulars aus.

  2. Klicken Sie auf das Symbol für die Guide-Container-Eigenschaften Guide-Eigenschaften. Das Dialogfeld „Container für ein adaptives Formular“ wird geöffnet.

  3. Öffnen Sie die Registerkarte Übermittlung.

    Klicken Sie auf das Schraubenschlüsselsymbol, um das Dialogfeld „Container für ein adaptives Formular“ zu öffnen und eine Umleitungsseite oder eine Dankesnachricht zu konfigurieren.

    • Wählen Sie zum Konfigurieren einer Umleitungs-URL für die Senden-Option die Option Zu URL umleiten aus, durchsuchen Sie eine AEM Sites-Seite und wählen Sie sie aus oder geben Sie die URL einer externen Seite an.

    • Wählen Sie zum Konfigurieren einer benutzerdefinierten Nachricht oder einer Dankesnachricht für die Senden-Option die Option Nachricht anzeigen aus und geben Sie im Feld Nachrichteninhalt eine Nachricht ein. Es handelt sich um ein Rich-Text-Feld. Sie können die Vollbildoption verwenden, um alle verfügbaren Rich-Text-Elemente anzuzeigen.

Konfigurieren eines Schemas oder Formulardatenmodells für ein adaptives Formular

Sie können das Formulardatenmodell verwenden, um ein Formular mit einer Datenquelle zu verbinden und Daten basierend auf Benutzeraktionen zu senden und zu empfangen. Sie können auch ein Formular mit einem JSON-Schema verbinden, um die gesendeten Daten in einem vordefinierten Format zu empfangen. Verbinden Sie Ihr Formular je nach Anforderung mit einem JSON-Schema oder Formulardatenmodell:

Konfigurieren eines JSON-Schemas oder Formulardatenmodells für das Formular

So konfigurieren Sie ein JSON-Schema oder ein Formulardatenmodell für Ihr Formular:

  1. Öffnen Sie den Inhalts-Browser und wählen Sie die Guide-Container-Komponente Ihres adaptiven Formulars aus.

  2. Klicken Sie auf das Symbol für die Guide-Container-Eigenschaften Guide-Eigenschaften. Das Dialogfeld „Container für ein adaptives Formular“ wird geöffnet.

  3. Öffnen Sie die Registerkarte Datenmodell.

    Klicken Sie auf das Schraubenschlüsselsymbol, um das Dialogfeld „Container für ein adaptives Formular“ zu öffnen und ein JSON-Schema oder Formulardatenmodell zu konfigurieren.

  4. Wählen Sie ein JSON-Schema oder ein Formulardatenmodell aus und konfigurieren Sie es entsprechend Ihren Anforderungen:

    • Wenn Sie die Option Formularmodell wählen, können Sie mit der Option Formulardatenmodell auswählen ein vorkonfiguriertes Formulardatenmodell auswählen.
    • Wenn Sie die Option Schema wählen, verwenden Sie die Option Schema, um ein JSON-Schema für Ihr Formular auszuwählen.

  5. Klicken Sie auf Fertig.

Konfigurieren eines Vorbefüllungsdienstes

Sie können den Vorbefüllungsdienst verwenden, um Felder eines adaptiven Formulars automatisch mit vorhandenen Daten auszufüllen. Wenn eine Benutzerin oder ein Benutzer ein Formular öffnet, sind die Werte für diese Felder schon vorbefüllt. Sie haben folgende Möglichkeiten:

Verwenden des Vorbefüllungsdienstes für Formulardatenmodelle zum Ausfüllen von Feldern eines adaptiven Formulars im Voraus

Sie können den Vorbefüllungsdienst für Formulardatenmodelle verwenden, um Felder eines adaptiven Formulars mit einem Formulardatenmodell oder einem benutzerdefinierten Vorbefüllungsdienst im Voraus auszufüllen. Der Vorbefüllungsdienst für das Formulardatenmodell verwendet den Get-Dienst des konfigurierten Formulardatenmodells zum Abrufen von Daten. So verwenden Sie für ein adaptives Formular den Vorbefüllungsdienst für Formulardatenmodelle:

  1. Öffnen Sie den Inhalts-Browser und wählen Sie die Guide-Container-Komponente Ihres adaptiven Formulars aus.
  2. Klicken Sie auf das Symbol für die Guide-Container-Eigenschaften Guide-Eigenschaften. Das Dialogfeld „Container für ein adaptives Formular“ wird geöffnet.
  3. Klicken Sie auf das Symbol für die Eigenschaften des Containers für adaptive Formulare Eigenschaften des Containers für adaptive Formulare. Das Dialogfeld der Container für adaptive Formulare zum Konfigurieren von Datenmodellen wird geöffnet.
    Klicken Sie auf das Schraubenschlüsselsymbol, um das Dialogfeld „Container für ein adaptives Formular“ zu öffnen und eine Umleitungsseite oder eine Dankesnachricht zu konfigurieren.
  4. Wählen Sie ein Formulardatenmodell aus. Öffnen Sie die Registerkarte Allgemein. Wählen Sie im Vorbefüllungsdienst die Option Vorbefüllungsdienst für Formulardatenmodell.
  5. Klicken Sie auf Fertig. Ihr adaptives Formular ist jetzt so konfiguriert, dass es die Vorbefüllung für Formulardatenmodelle verwendet. Sie können nun den Regeleditor verwenden, um Regeln zu erstellen, nach denen Felder des Formulars vorausgefüllt werden.

Bearbeiten der Formularmodelleigenschaften eines adaptiven Formulars

  1. Wählen Sie das adaptive Formular aus und tippen Sie auf Seiteninformationen => Eigenschaften öffnen. Die Seite mit den Formulareigenschaften wird geöffnet.

  2. Navigieren Sie zur Registerkarte Formularmodell und wählen Sie ein Formularmodell aus. Wenn das adaptive Formular ohne Formularmodell ist, können Sie entweder ein JSON-Schema oder ein Formulardatenmodell auswählen. Wenn das adaptive Formular jedoch bereits auf einem Formularmodell basiert, haben Sie die Möglichkeit, zu einem anderen Formularmodell desselben Typs zu wechseln. Wenn das Formular beispielsweise ein JSON-Schema verwendet, können Sie einfach zu einem anderen JSON-Schema wechseln. Wenn das Formular ein Formulardatenmodell verwendet, können Sie auch zu einem anderen Formulardatenmodell wechseln.

  3. Tippen Sie auf Speichern, um die Eigenschaften zu speichern.

Siehe auch

Vorherige Seite
Next page

Auf dieser Seite