Comment utiliser et personnaliser le conteneur « Puits » dans mes formulaires ?

Présentation et explications

La règle des 5 secondes : si vous avez besoin de créer une « zone » visuelle distincte ou un encart pour séparer un groupe de champs du reste de votre formulaire, le composant « Well » est l’outil qu’il vous faut.

Considérez un « Well » comme un conteneur structurel. Il ne collecte pas de données en soi ; il agit plutôt comme un cadre ou un dossier à l’écran, vous aidant à organiser des questions ou des instructions connexes afin que le formulaire soit plus facile à lire et à remplir pour votre équipe.

Fonctionnement (étape par étape)

1. Nommez votre conteneur : ouvrez les paramètres du composant. Sous l’onglet « Affichage », saisissez un libellé. Celui-ci sert de nom interne au conteneur. Si vous ne souhaitez pas que ce nom apparaisse sur le formulaire proprement dit, cochez la case « Masquer le libellé ».

   • Référence : consultez l’avertissement rouge « Le libellé est obligatoire » sur la première capture d’écran de l’onglet « Affichage ».

2. Définissez l’identifiant technique : passez à l’onglet « API ». Dans le champ « Nom de la propriété », attribuez au conteneur un nom abrégé simple et unique (par exemple, « well » ou « address_section »). Cela permet au système d’identifier ce champ spécifique.

   • Référence : comme indiqué sur la capture d’écran de l’onglet API.

3. Créer des règles « Afficher/Masquer » (facultatif) : si vous souhaitez que ce champ n’apparaisse que sous certaines conditions (par exemple, uniquement si un utilisateur sélectionne « Oui » à une question précédente), accédez à l’onglet « Conditionnel ». Vous pouvez y définir des règles simples pour automatiser l’affichage du conteneur.

   • Référence : comme indiqué sur la capture d’écran de l’onglet « Conditionnel ».

4. Ajouter une automatisation avancée (facultatif) : pour des besoins plus complexes, l’onglet « Logique » vous permet d’ajouter des comportements « si/alors » spécifiques au conteneur.

   • Référence : comme illustré sur la capture d’écran de l’onglet « Logique ».

5. Affiner la présentation : l’onglet « Mise en page » vous permet d’ajouter des attributs HTML spécifiques. Cette fonctionnalité est généralement utilisée pour une mise en forme avancée ou pour ajouter une superposition PDF si ce formulaire doit correspondre parfaitement à un document papier.

   • Référence : comme indiqué sur la capture d’écran de l’onglet « Mise en page ».

6. Vérifiez et enregistrez : vérifiez toujours le volet « Aperçu » situé à droite de la fenêtre pour voir à quoi ressemblera votre boîte. Une fois que vous êtes satisfait, cliquez sur le bouton vert « Enregistrer ».

Cas d’utilisation et avantages

• Regroupement des informations personnelles : placez les champs « Prénom », « Nom » et « E-mail » dans un « Well » afin de séparer clairement les coordonnées du reste du dossier de candidature.

• Mise en évidence des instructions : utilisez un « Well » pour contenir un bloc de texte ou des informations « en lecture seule » fournissant des indications pour la section suivante du formulaire.

• Amélioration de la fluidité du formulaire : en regroupant les champs liés, vous réduisez la « fatigue liée aux formulaires », ce qui rend les longs documents plus organisés et moins intimidants pour l’utilisateur.

• Sections conditionnelles : utilisez un « Well » pour contenir cinq questions différentes qui restent toutes masquées jusqu’à ce que l’utilisateur déclenche une règle « conditionnelle » spécifique, ce qui permet de conserver la clarté du formulaire.