Meilleures pratiques pour travailler avec les formulaires adaptatifs best-practices-for-working-with-adaptive-forms

Utilisez le aem-project-archetype d’Apache Maven pour créer et gérer la structure d’un projet AEM. Il permet de créer la structure et les modèles recommandés pour votre projet AEM. En outre, il fournit des systèmes d’automatisation de création et de contrôle des modifications pour aider à la gestion du projet.

• Utilisez la commande Mavenarchetype:generate pour générer la structure initiale.
• Utilisez la commande Maven eclipse:eclipse pour générer les fichiers de projet Eclipse et importer le projet dans Eclipse.

L’outil FileVault ou VLT vous permet de mapper le contenu d’une instance CRX ou AEM à votre système de fichiers. Il fournit des opérations de gestion de contrôle des modifications, telles que l’archivage et l’extraction du contenu du projet AEM. Voir Comment utiliser l’outil VLT.

Si vous utilisez un environnement de développement intégré à Eclipse, vous pouvez utiliser AEM outils de développement pour une intégration transparente de l’IDE Eclipse avec les instances AEM afin de créer des applications AEM. Pour plus d’informations, voir AEM outils de développement pour Eclipse.

Un modèle de formulaire adaptatif est une page d’AEM spécialisée qui définit la structure et les informations d’en-tête et de pied de page d’un formulaire adaptatif. Un modèle comporte des mises en page, des styles et une structure de base préconfigurés pour un formulaire adaptatif. AEM Forms fournit des modèles et des composants prêts à l’emploi que vous pouvez utiliser pour créer des formulaires adaptatifs. Cependant, vous pouvez créer des modèles et des composants personnalisés selon vos besoins. Il est recommandé de rassembler les exigences relatives aux modèles et composants supplémentaires dont vous aurez besoin dans vos formulaires adaptatifs. Pour plus d’informations, voir Personnalisation des formulaires et composants adaptatifs.

AEM Forms vous permet de créer des formulaires adaptatifs basés sur les modèles de formulaires suivants. Les modèles de formulaire font office d’interface pour l’échange de données entre un formulaire et un système AEM et fournissent une structure XML pour le flux de données à l’intérieur et à l’extérieur d’un formulaire adaptatif. En outre, les modèles de formulaire imposent des règles et des contraintes aux formulaires adaptatifs sous la forme de schémas et de contraintes XFA.

• Aucun: Les formulaires adaptatifs créés avec cette option n’utilisent aucun modèle de formulaire. Les données XML générées à partir de ce type de formulaire présentent une structure plate avec des champs et des valeurs correspondantes.
• Schéma XML ou JSON  : les schémas XML et JSON représentent la structure dans laquelle les données sont générées ou utilisées par le système back-end de l’entreprise. Vous pouvez associer un schéma à un formulaire adaptatif et utiliser ses éléments pour ajouter du contenu dynamique à un formulaire adaptatif. Les éléments du schéma sont disponibles dans l’onglet Objet du modèle de données du navigateur de contenu pour la création de formulaires adaptatifs. Vous pouvez faire glisser et déposer les éléments du schéma pour créer le formulaire.
• Modèle de formulaire XFA: Il s’agit d’un modèle de formulaire idéal si vous avez des investissements dans des formulaires HTML5 basés sur XFA. Il fournit un moyen direct de convertir vos formulaires basés sur XFA en formulaires adaptatifs. Toutes les règles XFA existantes sont conservées dans les formulaires adaptatifs associés. Les formulaires adaptatifs obtenus prennent en charge les éléments XFA, tels que les validations, les événements, les propriétés et les modèles.
• Modèle de données de formulaire  : il s’agit du modèle de formulaire idéal si vous souhaitez intégrer les systèmes back-end tels que les bases de données, les services web et un profil utilisateur AEM pour préremplir des formulaires adaptatifs et enregistrer des données de formulaire envoyé dans les systèmes back-end. Un éditeur de modèle de données de formulaire vous permet de définir et de configurer des entités et des services dans un modèle de données de formulaire que vous pouvez utiliser pour créer des formulaires adaptatifs. Pour plus d’informations, voir Intégration de données AEM Forms.

AEM Forms fournit des modèles de formulaire adaptatif prêts à l’emploi que vous pouvez utiliser pour créer des formulaires adaptatifs. Vous pouvez également créer vos propres modèles. AEM fournit des modèles statiques et modifiables.

• Les modèles statiques sont définis et configurés par les développeurs.
• Les modèles modifiables sont créés par les auteurs à l’aide de l’éditeur de modèles. L'éditeur de modèles permet de définir une structure de base et un contenu initial dans un modèle. Toute modification du calque de structure est répercutée dans tous les formulaires utilisant ce modèle. Le contenu initial peut inclure un thème préconfiguré, un service de préremplissage, une action d’envoi, etc. Cependant, ces paramètres peuvent être modifiés pour un formulaire à l’aide de l’éditeur de formulaire. Pour plus d’informations, voir Modèles de formulaires adaptatifs.

Pour définir le style d’une instance ou d’un panneau spécifique, utilisez le style en ligne. Vous pouvez également définir une classe dans un fichier CSS et spécifier son nom dans la propriété Classe CSS du composant.

Incluez une bibliothèque cliente dans un composant pour appliquer de manière cohérente des styles aux formulaires adaptatifs ou aux fragments qui utilisent ce composant. Pour plus d’informations, voir Création d’un composant de page de formulaire adaptatif.

Appliquez des styles définis dans une bibliothèque cliente pour sélectionner des formulaires adaptatifs en spécifiant le chemin d’accès à la bibliothèque cliente dans le champ de chemin d’accès au fichier CSS dans les propriétés du conteneur de formulaires adaptatifs.

Pour créer une bibliothèque cliente de vos styles, vous pouvez configurer le fichier CSS personnalisé dans la bibliothèque cliente de base de l’éditeur de thème ou dans les propriétés du conteneur de formulaires.

Les formulaires adaptatifs fournissent des dispositions de panneau, telles que réactives, avec onglets, accordéons et assistant, pour contrôler la disposition des composants de formulaire dans un panneau. Vous pouvez créer des dispositions de panneau personnalisées et les rendre disponibles pour les auteurs de formulaires. Pour plus d’informations, voir Création de composants de disposition personnalisés pour les formulaires adaptatifs.

Vous pouvez également personnaliser des composants de formulaire adaptatif spécifiques tels que les champs et la disposition des panneaux.

• Utilisez la variable Incrustation de l’AEM pour modifier une copie d’un composant. Il n’est pas recommandé de modifier les composants par défaut.
• Pour personnaliser la mise en page des composants de formulaire adaptatif prêts à l’emploi dans /libs, créer des composants de disposition personnalisés ; en plus de la fonction dispositions par défaut.
• Introduisez des interactivités personnalisées en créant des widgets ou des apparences personnalisés. Il n’est pas recommandé de modifier les composants par défaut. Pour plus d’informations, voir Structure de l’apparence.

Pour connaître les recommandations relatives à la gestion des données d’identification personnelle, reportez-vous à la section Gestion des informations d’identification personnelle.

Utilisez le navigateur d’objets de la barre latérale pour accéder rapidement aux champs dans la partie la plus basse de la hiérarchie du formulaire. Vous pouvez utiliser la zone de recherche pour rechercher des objets dans le formulaire ou l’arborescence d’objets pour passer d’un objet à un autre.

Pour afficher et modifier les propriétés d’un composant dans le navigateur de composants dans la barre latérale, sélectionnez le composant, puis cliquez sur . Vous pouvez également double-cliquer sur un composant pour afficher ses propriétés dans l’explorateur de propriétés.

Utilisez les raccourcis clavier pour exécuter des actions rapides sur vos formulaires. Voir Raccourcis clavier AEM Forms.

Les composants de formulaire adaptatif sont recommandés pour une utilisation uniquement dans les pages de formulaire adaptatif. Les composants dépendent de leur hiérarchie parent. Par conséquent, ne les utilisez pas dans une page AEM.

Utilisez des noms significatifs et uniques pour les champs de formulaire et les composants afin d’éviter tout conflit potentiel lors de la création de règles.

Utilisez l’opérateur this pour un composant afin d’y faire mention lors de l’expression d’une règle. Ainsi, la règle reste valide même si le nom du composant est modifié. Par exemple, field1.valueCommit script: this.value > 10.

Utilisez les noms de composant lorsque vous faites référence à d’autres composants de formulaire. Utilisez la propriété value pour récupérer la valeur d’un champ ou d’un composant. Par exemple, field1.value.

Désignez les composants selon une hiérarchie relative unique afin d’éviter tout conflit. Par exemple, parentName.fieldName.

Lorsque vous manipulez des règles complexes ou fréquemment utilisées, pensez à définir la logique commerciale comme fonctions dans une bibliothèque cliente distincte que vous pouvez spécifier et réutiliser dans les formulaires adaptatifs. La bibliothèque client doit être une bibliothèque autonome et ne doit donc avoir aucune dépendance externe, à l’exception de jQuery et Underscore.js. Vous pouvez également utiliser la bibliothèque cliente pour imposer la revalidation côté serveur des données de formulaire envoyées.

Les formulaires adaptatifs fournissent un ensemble d’API que vous pouvez utiliser pour communiquer et effectuer des actions sur les formulaires adaptatifs. Certaines des API clés sont les suivantes. Pour plus d’informations, voir Référence de l’API de la bibliothèque JavaScript pour Adaptive Forms.

• guideBridge.reset() : permet de réinitialiser un formulaire.

• guideBridge.submit() : permet de soumettre un formulaire.

• guideBridge.setFocus(somExp, focusOption, runCompletionExp) : permet de se concentrer sur un champ.

• guideBridge.validate(errorList, somExpression, focus) : permet de valider un formulaire.

• guideBridge.getDataXML(options) : permet d’obtenir les données de formulaire en tant que XML.

• guideBridge.resolveNode(somExpression) : permet d’obtenir un objet de formulaire.

• guideBridge.setProperty(somList, propertyName, valueList) : permet de définir la propriété d’un objet de formulaire.

• En outre, vous pouvez utiliser les propriétés de champ suivantes :

  • field.value pour modifier la valeur d’un champ ;
  • field.enabled pour activer/désactiver un champ ;
  • field.visible pour modifier la visibilité d’un champ.

Les auteurs de formulaires adaptatifs peuvent avoir besoin d’écrire du code JavaScript pour créer une logique métier dans un formulaire. Bien que JavaScript soit puissant et efficace, il est probable qu’il puisse compromettre les attentes en matière de sécurité. Par conséquent, vous devez vous assurer que l’auteur du formulaire est une personne de confiance et qu’il existe des processus pour examiner et approuver le code JavaScript avant qu’un formulaire ne soit mis en production. L’administrateur peut restreindre l’accès à l’éditeur de règles aux groupes d’utilisateurs en fonction de leur rôle ou de leur fonction. Voir Accorder l’accès à l’éditeur de règles à certains groupes d’utilisateurs.

Vous pouvez utiliser des expressions dans les règles pour rendre les formulaires adaptatifs dynamiques. Toutes les expressions sont des expressions JavaScript valides et utilisent des API de modèle de script de formulaires adaptatifs. Ces expressions renvoient des valeurs de certains types. Pour plus d’informations sur les expressions et les meilleures pratiques associées, voir Expressions des formulaires adaptatifs.

Il est recommandé de créer si possible des formulaires adaptatifs à l’aide du modèle de données de formulaire XSD, et ce, même lors de la conversion d’un XFA en formulaire adaptatif.

Incluez uniquement les champs et les panneaux dans les formulaires adaptatifs qui capturent les informations de l’utilisateur. Pensez à conserver un contenu statique minimal ou utilisez des URL pour les ouvrir dans une fenêtre distincte.

Bien que chaque formulaire soit conçu pour un usage spécifique, il existe des segments communs dans la plupart des formulaires. Par exemple, les détails personnels, l’adresse, les détails de l’emploi, etc. Créez des fragments de formulaire adaptatif pour les éléments et sections de formulaire communs et utilisez-les dans les formulaires. Vous pouvez également enregistrer un panneau dans un formulaire existant en tant que fragment. Toute modification apportée à un fragment est répercutée dans tous les formulaires adaptatifs associés. Cette fonction favorise la création en collaboration : plusieurs auteurs peuvent ainsi travailler simultanément sur différents fragments composant un formulaire.

• Comme pour les formulaires adaptatifs, il est recommandé de définir tous les scripts personnalisés et de style spécifiques aux fragments dans la bibliothèque cliente à l’aide de la boîte de dialogue du conteneur de fragments. Essayez également de créer des fragments auto-suffisants qui ne dépendent pas d’objets en dehors de celui-ci.
• Évitez d’utiliser des scripts de fragments croisés. S’il existe un objet en dehors du fragment auquel vous devez vous référer, essayez de faire de cet objet une partie du formulaire parent. Si l’objet doit rester dans un autre fragment, reportez-vous à celui-ci par son nom dans le script.

Utilisez l’option Enregistrer et reprendre avec l’enregistrement automatique pour enregistrer régulièrement le formulaire adaptatif et permettre aux utilisateurs de le revoir ultérieurement pour remplir le formulaire.

Configurez les fragments à charger en différé. Au moment de l’exécution, les fragments marqués pour chargement différé sont rendus uniquement lorsqu’ils sont requis. Cela réduit considérablement le temps de chargement des formulaires volumineux. Elle est également prise en charge dans les fragments avec des panneaux répétables. Pour plus d’informations, voir Configuration du chargement différé.

• Ne configurez pas le chargement différé sur les fragments dans une mise en page en grille réactive ou dans le premier panneau.
• Les composants des pièces jointes et des conditions générales ne sont pas pris en charge dans les fragments chargés en différé.
• Marquez une valeur dans un panneau chargé différé comme Utiliser la valeur globalement si cette valeur est utilisée dans une autre partie du formulaire afin que la valeur soit disponible lorsque le panneau contenant est déchargé.
• Pensez à créer des règles de visibilité pour les fragments qui doivent s’afficher ou être masqués en fonction d’une condition.

AEM Forms fournit un service de préremplissage pour lire les données d’un fichier XML de données prédéfini et préremplir les champs d’un formulaire adaptatif avec le contenu dans le fichier XML prérempli.

Les données XML de préremplissage doivent être conformes au schéma du modèle de formulaire associé au formulaire adaptatif.

Incluez les sections afBoundedData et afUnBoundedData dans le fichier XML prérempli pour préremplir les champs liés et non liés d’un formulaire adaptatif.

Pour les formulaires adaptatifs basés sur un modèle de données de formulaire, AEM Forms fournit un service de préremplissage de modèles de données de formulaire prêts à l’emploi. Le service de préremplissage interroge les sources de données pour les objets de modèle de données dans le formulaire adaptatif et préremplit les valeurs de champ lors du rendu du formulaire.

Vous pouvez également utiliser les formulaires adaptatifs de préremplissage de fichiers, crx, service ou http.

AEM Forms prend en charge les services de préremplissage personnalisés que vous pouvez brancher en tant que service OSGi pour préremplir les formulaires adaptatifs.

Selon le modèle de données de formulaire sur lequel un formulaire adaptatif est basé, vous pouvez configurer un modèle de document d’enregistrement comme suit :

• Modèle de formulaire XFA: Utilisez le fichier XDP associé comme modèle de DE.
• Schéma XSD: Utilisez le modèle XFA associé qui utilise le même schéma XML que celui utilisé par le formulaire adaptatif.
• Aucun: Utilisation d’un document d’enregistrement généré automatiquement.

Configurez l’en-tête, le pied de page, les images, la couleur, la police, etc. à partir de l’onglet Document d’enregistrement de l’éditeur de formulaire adaptatif.

Utilisez DoRService pour générer le document d’enregistrement par programmation.

Excluez les champs masqués du document d’enregistrement.

Utilisez le paramètre de demande afAcceptLang pour afficher le document d’enregistrement dans une autre langue.

Utilisez les fragments de formulaire adaptatif pour les éléments courants des formulaires et localisez les fragments. Cela permet de localiser un fragment une seule fois et de le refléter dans tous les formulaires dans lesquels le fragment localisé est utilisé.

Les modifications telles que l’ajout d’un nouveau composant ou l’application d’un script dans un formulaire localisé ne sont pas localisées automatiquement. Par conséquent, vous devez finaliser un formulaire avant de le localiser pour éviter plusieurs cycles de localisation.

Utilisez le paramètre de requête afAcceptLang pour remplacer la langue du navigateur et pour rendre le formulaire dans la langue spécifiée. Par exemple, l’URL suivante force à effectuer le rendu du formulaire en japonais, indépendamment du paramètre régional spécifié dans les paramètres du navigateur :

https://[*server*]:[*port*]/<*contextPath*>/<*formFolder*>/<*formName*>.html?wcmmode=disabled&afAcceptLang=ja

AEM Forms prend actuellement en charge la localisation du contenu des formulaires adaptatifs en anglais (en), espagnol (es), français (fr), italien (it), allemand (de), japonais (ja), portugais-brésilien (pt-BR), chinois- (zh-CN), chinois-Taïwan (zh-TW) et coréen (ko-KR). Cependant, vous pouvez ajouter la prise en charge de nouveaux paramètres régionaux pour les formulaires adaptatifs à l’exécution. Pour plus d’informations, voir Prise en charge de nouveaux paramètres régionaux pour la localisation de formulaires adaptatifs.

Activez la compression de la bibliothèque client HTML pour Javascript et CSS à partir de la console Felix.

Masquez toutes les bibliothèques clientes sous /etc.clientlibs/fd et toutes les bibliothèques clientes personnalisées supplémentaires dans AEM Dispatcher pour améliorer la réactivité et la sécurité des formulaires publiés. Pour plus d’informations, reportez-vous à la section Dispatcher.

Ne mettez pas en cache les chemins d’accès /content/forms/af/ et /content/dam/formsanddocuments/*. Pour plus d’informations sur la configuration de la mise en cache de formulaires adaptatifs, voir Mise en cache de formulaires adaptatifs.

Activez le HTML via le module de compression de serveur web. Pour plus d’informations, voir Réglage des performances du serveur AEM Forms.

Augmentez la configuration des appels par requête pour les formulaires volumineux. Voir Optimisation des performances de formulaires complexes et volumineux.

Créer pages d’erreur personnalisées affichées par le gestionnaire d’erreur.

Sécurisez le serveur AEM Forms.

• Utilisez le mode d’exécution nosamplecontent pour vous assurer qu’aucun exemple de contenu ou d’utilisateur ne soit déployé sur le serveur de production. Voir Exécution d’AEM selon le mode prêt pour la production.

Laissez la taille du tas à 8 Go au minimum. Pour connaître les autres paramètres, voir Réglage des performances du serveur AEM Forms.

Utilisez les sessions utilisateurs du service au lieu des sessions d’administration pour exécuter les tâches au niveau du service. Pour plus d’informations, voir Authentification du service.

Stockage des données de brouillon  : si vous utilisez la fonction Brouillon des formulaires adaptatifs, vous devez implémenter une SPI (Service Provide Interface) personnalisée pour le stockage des données de brouillon dans un espace de stockage plus sécurisé comme une base de données. Pour plus d’informations, voir Exemple d’intégration d’un composant de brouillons et d’envois à la base de données.

Stockage des données d’envoi  : si vous utilisez l’envoi de stockage du portail de formulaires, vous devez implémenter une SPI personnalisée pour stocker les données d’envoi dans une base de données. Voir Exemple d’intégration d’un composant brouillons & envois à la base de données pour obtenir un exemple d’intégration.

Vous pouvez également écrire une action d’envoi personnalisée qui stocke les données de formulaires et les pièces jointes dans un espace de stockage sécurisé. Pour plus d’informations, voir Créer une action Envoyer personnalisée pour les formulaires adaptatifs.