Asynchrone Übermittlung von adaptiven Formularen asynchronous-submission-of-adaptive-forms

Web-Formulare werden herkömmlicherweise für die synchrone Übermittlung konfiguriert. Wenn Benutzer ein Formular senden, werden sie zu einer Bestätigungsseite oder, falls die Übermittlung fehlschlägt, zu einer Fehlerseite umgeleitet. Allerdings sind moderne Web-Abläufe wie Einzelseitenanwendungen zunehmend beliebt. Dabei bleibt die Web-Seite unverändert, während die Client-Server-Interaktion im Hintergrund abläuft. Sie können diese Erfahrung jetzt in adaptiven Formularen bieten, indem Sie die asynchrone Übermittlung konfigurieren. In diesem Fall verhält sich ein adaptives Formular wie eine Einzelseitenanwendung, da das Formular nicht neu geladen wird oder sich seine URL nicht ändert, wenn die gesendeten Formulardaten auf dem Server validiert werden.

Weitere Informationen zur asynchronen Übermittlung in adaptiven Formularen finden Sie im Abschnitt .

Asynchrone Übermittlung konfigurieren configure

So konfigurieren Sie die asynchrone Übermittlung für ein adaptives Formular:

Funktionsweise der asynchronen Übermittlung how-asynchronous-submission-works

AEM Forms bietet vordefinierte Erfolgs- und Fehler-Handler für die Formularübermittlung. Handler sind clientseitige Funktionen, die basierend auf der Serverantwort ausgeführt werden. Wenn ein Formular gesendet wird, werden die Daten zur Validierung an den Server übermittelt, der eine Antwort mit Informationen zum Erfolgs- oder Fehlerereignis für die Übermittlung an den Client zurückgibt. Die Informationen werden als Parameter an den relevanten Handler übergeben, um die Funktion auszuführen.

Darüber hinaus können Formularautoren und -entwickler formularspezifische Regeln schreiben, die die Standard-Handler überschreiben. Weitere Informationen finden Sie unter Standard-Handler mithilfe von Regeln überschreiben.

Lassen Sie uns zunächst die Serverantwort auf Erfolgs- und Fehlerereignisse überprüfen.

Server-Antwort für Erfolgsereignis bei Übermittlung server-response-for-submission-success-event

Die Server-Antwort für Erfolgsereignis bei Übermittlung weist folgende Struktur auf:

{
  contentType : "<xmlschema or jsonschema>",
  data : "<dataXML or dataJson>" ,
  thankYouOption : <page/message>,
  thankYouContent : "<thank you page url/thank you message>"
}

Die Serverantwort im Falle einer erfolgreichen Formularübermittlung umfasst Folgendes:

Der Erfolgshandler liest die Serverantwort und leitet entsprechend zur konfigurierten Seiten-URL weiter oder zeigt eine Nachricht an.

Serverantwort für Fehlerereignis bei Übermittlung server-response-for-submission-error-event

Die Struktur der Serverantwort für das Ereignis bei Übertragungsfehlern sieht wie folgt aus:

{
   errorCausedBy : "<CAPTCHA_VALIDATION or SERVER_SIDE_VALIDATION>",

   errors : [
               { "somExpression" : "<SOM Expression>",
                 "errorMessage"  : "<Error Message>"
               },
               ...
             ]
 }

Die Serverantwort im Fall eines Fehlers bei der Formularübermittlung umfasst Folgendes:

Der Fehler-Handler liest die Serverantwort und zeigt dementsprechend die Fehlermeldung im Formular an.

Standard-Handler mithilfe von Regeln außer Kraft setzen custom

Formularentwickler und -autoren können im Code-Editor auf Formularebene Regeln schreiben, um Standard-Handler zu überschreiben. Die Antwort des Servers bei Erfolgs- und Fehlerereignissen wird auf Formularebene bereitgestellt, auf die Entwickler mithilfe von $event.data in Regeln zugreifen können.

Führen Sie die folgenden Schritte aus, um im Codeeditor Regeln zu schreiben, um die Erfolgs- und Fehlerereignisse zu verarbeiten.