Afficher ou Masquer Plusieurs Champs d’un Seul Coup à l’Aide du Champ de Réduction de la Section

September 16, 2021

Dans ce tutoriel, nous allons apprendre à masquer ou à afficher plusieurs champs de formulaire en fonction d’une seule logique conditionnelle – en utilisant le champ/l’élément Réduction de la section. Avant de continuer, nous devons d’abord nous familiariser avec le champ Réductoin de la section.

Qu’est-ce qu’une Réduction de la section demandez-vous?

Eh bien, selon cet article de JotForm sur les champs de formulaire:

Le champ Réduction de la section masque/affiche une section de votre formulaire et divise votre formulaire en parties extensibles. 

Dans ce cas, nous utiliserons la Réduction de la section pour diviser le formulaire en sections et nous utiliserons une logique conditionnelle pour les masquer ou les afficher en fonction de l’action final de l’utilisateur.

 

1. Insérez une réduction de la section au début de chaque groupe que vous souhaitez séparer. 

Cela marquera le début de la section que vous souhaitez masquer/afficher sous condition. Insérez autant de champs que vous le souhaitez dans cette section. Dans cet exemple de formulaire, je regrouperai les champs liés à chaque section d’un invité, j’aurai “Invité(e) 1”, “Invité(e) 2” et “Invité(e) 3”, ayant tous leurs propres champs de nom complet et d’e-mail.

 

 

Propriétés de Réduction de la section

Il y a deux paramètres importants ici, la “Visibilité de la section” et la “Visibilité du bouton“.

Visibilité de la section => Cela vous permet de définir le champ de réduction pour qu’il s’ouvre ou se ferme par défaut. Ouvert, ce qui signifie que la section ou son contenu est visible. Fermer signifie que le contenu est caché .

Visibilité du bouton => Cela vous permet d’afficher ou de masquer la barre ou le bouton de réduction. Définissez-le sur masqué si vous ne souhaitez pas que la barre/le bouton s’affiche, définissez-le sur visible si vous souhaitez que vos utilisateurs le voient. Notez que si le bouton est visible, vos utilisateurs peuvent ouvrir et fermer la visibilité de la section dans le formulaire en direct. 

 

 

 

Une flèche pointant vers le bas dans la réduction de la section signifie que cette section est définie sur “Ouvrir” ou “VISIBLE” par défaut.

Dans mon cas, je ne veux pas afficher le bouton de réduction de la section, j’ai donc défini la visibilité du bouton sur masqué, puis défini la visibilité de la section sur visible. C’est pour rendre ma configuration plus propre car j’utiliserai la logique conditionnelle plus tard. 

2. Terminez votre section en utilisant un autre champ Réduction de la section.

Une Réduction de la section englobe tous les champs suivants, à l’exception d’une autre réduction de section. À moins que votre section de formulaire ne soit suivie d’une autre (c’est-à-dire plusieurs sections consécutives), vous devrez placer un bouchon/arrêt pour terminer cette section.

Nous pouvons y parvenir en ajoutant un autre Réduction de la section configuré en tant que [Section: Visible] et [Bouton: Masqué].

 

 

 

3. Ajoutez une condition pour masquer ou afficher une section.

Maintenant que vos sections sont définies, vous pouvez commencer à ajouter des règles au générateur de conditions

 

 

Vous pouvez ensuite formuler vos conditions pour masquer ou afficher les Réduction de la section correspondantes. Consultez les exemples de formulaires ci-dessous et n’hésitez pas à le cloner sur votre compte pour savoir exactement comment cette solution a été mise en uvre.

Voici un formulaire simple qui montre chaque section pour un invité en fonction du nombre d’invités saisis: https://www.jotform.com/211823690192960. Vous trouverez ci-dessous les étapes de configuration des conditions pour le champ de réduction de section.

a. Tout d’abord, j’ai configuré les règles ou l’instruction “SI” au moment où l’action sera déclenchée. 

 

b. Je choisirai “Afficher plusieurs” dans ce cas pour afficher le champ de réduction de section pour “Invité(e) 1”, “Invité(e) 2” et “Invité(e) 3”, en fonction du nombre d’invités ajoutés.

 

Remarque importante: Il est préférable d’utiliser les mêmes instructions “ALORS” sur un champ de formulaire lié à plusieurs conditions. Dans mon cas, j’utiliserai “Afficher plusieurs” sur tous les champs de réduction de section. Pour sélectionner plusieurs champs à afficher, appuyez sur CTRL + clic de souris (clic gauche pour Windows) ou touche Commande + clic de souris (Mac).

c. Répétez le même processus pour savoir comment ajouter la condition pour “Invité(e) 2” et “Invité(e) 3”. 

 

 

 

d. Voici à quoi ressemblait la liste de mes conditions pour toutes les sections “Invité(e)” qui utilisent le champ Réduction de la section:

 

 e. Enregistrez les modifications et testez votre formulaire. Vous avez maintenant un formulaire avec des groupes divisés en sections et ne s’affichera qu’en fonction d’une certaine entrée.

  

Comme toujours, n’hésitez pas à demander de l’aide via le Forum de Support JotForm si vous rencontrez des difficultés lors de la mise en uvre de cette solution.

Ce guide vous a-t-il aidé ?

Envoyer un commentaire:

JotForm Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Commentaire:

Podo CommentSoyez le premier à commenter.