Configuration de l’envoi asynchrone d’AEM Forms adaptatif asynchronous-submission-of-adaptive-forms

Version
Lien de l’article
AEM 6.5
Cliquez ici
AEM as a Cloud Service
Cet article

Traditionnellement, les formulaires web sont configurés à des fins d’envoi synchrone. Lors d’un envoi synchrone, lorsque les utilisateurs envoient un formulaire, ils sont redirigés vers une page d’accusé de réception, une page de remerciement ou, en cas d’échec de l’envoi, une page d’erreur. Toutefois, les expériences Web modernes telles que les applications d’une seule page gagnent en popularité. Dans une application de ce type, la page Web reste statique tandis que l’interaction entre le client et le serveur se déroule en arrière-plan. Vous pouvez configurer l’envoi asynchrone pour fournir cette expérience avec des formulaires adaptatifs.

Lors d’un envoi asynchrone, lorsqu’un utilisateur envoie un formulaire, le développeur de formulaires se connecte à une expérience distincte, notamment la redirection vers un autre formulaire ou une section distincte du site Web. L’auteur peut également ajouter des services distincts comme l’envoi de données à un autre magasin de données ou l’ajout d’un moteur d’analyse personnalisé. En cas d’envoi asynchrone d’un formulaire adaptatif, celui-ci se comporte comme une application d’une seule page, puisqu’il ne se recharge pas et que son adresse URL ne change pas lorsque ses données sont validées sur le serveur.

Lisez la suite pour plus de détails sur l’envoi asynchrone dans les formulaires adaptatifs.

Configuration de l’envoi asynchrone configure

Pour configurer l’envoi asynchrone d’un formulaire adaptatif :

  1. En mode de création de formulaire adaptatif, sélectionnez l’objet Conteneur de formulaires et choisissez cmppr1 pour ouvrir ses propriétés.

  2. Dans la section des propriétés Envoi, activez Utiliser l’envoi asynchrone.

  3. Dans le Lors de l’envoi , sélectionnez l’une des options suivantes à exécuter lors de l’envoi réussi d’un formulaire.

    • Rediriger vers l’URL: redirige vers l’URL ou la page spécifiée lors de l’envoi du formulaire. Vous pouvez spécifier une URL ou sélectionner le chemin d’accès à une page dans le champ URL/Chemin d’accès restreint.
    • Afficher le message  : affiche un message lors de l’envoi d’un formulaire. Vous pouvez rédiger un message dans le champ de texte situé en dessous de l’option Afficher le message. Le champ de texte prend en charge la mise en forme de texte enrichi.
  4. Sélectionner check-button1 pour enregistrer les propriétés.

Fonctionnement de l’envoi asynchrone how-asynchronous-submission-works

Experience Manager Forms fournit des gestionnaires de succès et d’erreur prêts à l’emploi pour les envois de formulaires. Les gestionnaires sont des fonctions côté client qui s’exécutent en fonction de la réponse du serveur. Lorsqu’un formulaire est envoyé, les données sont transmises au serveur pour validation, ce qui renvoie une réponse au client avec des informations sur l’événement de succès ou d’erreur pour l’envoi. Les informations sont transmises comme paramètres au gestionnaire approprié pour exécuter la fonction.

En outre, les auteurs de formulaire et les développeurs peuvent écrire des règles au niveau du formulaire pour remplacer les gestionnaires par défaut. Pour plus d’informations, voir Remplacement des gestionnaires par défaut à l’aide de règles.

Examinons d’abord la réponse du serveur pour les événements de succès et d’erreur.

Réponse du serveur pour l’événement de succès de l’envoi server-response-for-submission-success-event

La structure de la réponse du serveur pour l’événement de succès de l’envoi est la suivante :

{oneOf: [
{  properties : {
     contentType : {"type" : "string",  "enum" : ["xmlschema", "jsonschema"]},
    data : {type : "string", description : "Form data in XML or  JSON  format"},
   thankYouOption : {type : "string"}
   }},
  properties : {
     contentType : {"type" : "string",  "enum" : ["xmlschema", "jsonschema"]},
    data : {type : "string", description : "Form data in XML or  JSON  format"},
   thankYouContent: {type: "string"}
   }
]

}

La réponse du serveur en cas d’envoi de formulaire réussi comprend :

  • Type de format de données de formulaire : XML ou JSON
  • Données de formulaire au format XML ou JSON
  • Option sélectionnée pour rediriger vers une page ou afficher un message tel que configuré dans le formulaire.
  • URL de la page ou contenu du message tel que configuré dans le formulaire

Le gestionnaire de succès lit la réponse du serveur et redirige en conséquence vers l’URL de page configurée ou affiche un message.

Réponse du serveur pour l’événement d’erreur d’envoi server-response-for-submission-error-event

La structure de la réponse du serveur pour l’événement d’erreur d’envoi est la suivante :

{
   errorCausedBy : "<CAPTCHA_VALIDATION or SERVER_SIDE_VALIDATION>",

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

La réponse du serveur en cas d’erreur lors de l’envoi du formulaire comprend :

  • Raison de l’erreur, échec de la validation CAPTCHA ou côté serveur
  • Liste des objets d’erreur, qui inclut l’expression SOM du champ dont la validation a échoué et le message d’erreur correspondant.

Le gestionnaire d’erreurs lit la réponse du serveur et affiche en conséquence le message d’erreur sur le formulaire.

Remplacer les gestionnaires par défaut en utilisant des règles custom

Les développeurs et les auteurs de formulaires peuvent écrire des règles, au niveau du formulaire, de code pour remplacer les gestionnaires par défaut. La réponse du serveur pour les événements de succès et d’erreur est exposée au niveau du formulaire. Les développeurs peuvent y accéder à l’aide de $event.data dans les règles.

Effectuez les étapes suivantes pour écrire des règles afin de gérer les événements de succès et d’erreur.

  1. Ouvrez le formulaire adaptatif en mode création, sélectionnez un objet de formulaire, puis sélectionnez edit-rules1 pour ouvrir l’éditeur de règles.

  2. Sélectionner Formulaire dans l’arborescence des objets de formulaire et sélectionnez Créer.

  3. Sélectionnez est envoyé avec succès ou l’envoi échoue dans la liste déroulante Sélectionner l’état.

  4. Définissez une action Ensuite pour l’état sélectionné. Par exemple, sélectionnez Accéder à, puis tapez ou collez une URL. Vous pouvez également faire glisser n’importe quelle fonction à l’aide de l’onglet Fonctions vers la règle.

    gestionnaire d’envoi réussi

  5. Sélectionner Terminé pour enregistrer la règle.

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab