Les règles permettent d'afficher ou de masquer certains champs de façon conditionnelle.

Cette page présente une marche à suivre complète pour l'établissement de règles d'affichage, sous la forme d'un exemple.

Mise en situation

Vous désirez créer un formulaire permettant d'inscrire des équipes à un tournoi de football. Vous voulez que votre formulaire permette d'inscrire jusqu'à cinq équipes dans chacune des catégories suivantes :

  1. Junior ;
  2. Senior ;
  3. Vétérans.

Données collectées

Vous voulez collecter deux données par équipe : le nom de l'équipe et sa catégorie.

Mise en page du formulaire

À ce stade, deux options s'offrent à vous.

  1. Soit vous créez une page par équipe, avec un champ texte pour le nom d'équipe et une liste des catégories (liste déroulante ou boutons radio).
  2. Soit vous créez une page par catégorie, avec cinq champs textes pour les noms d'équipes.

Dans le premier cas, vous aurez 15 pages pour les équipes, sur chacune desquelles vous devrez recopier la liste des catégories. Dans le second cas, vous aurez 3 pages pour les équipes.

Le désavantage principal du premier cas est donc de devoir répéter 15 fois les trois éléments ci-dessous, et l'avantage est qu'il n'y a à gérer des règles que pour les pages.

 

Figure 54 - Cas 1

Le désavantage principal du second cas est de devoir gérer des règles d'affichage pour les champs et pour les pages. Le grand avantage, toutefois, est qu'il y a moins de champs à insérer et que l'utilisateur aura donc moins de champs et de pages à remplir.

Figure 55 - Cas 2

Dans cet exemple, vous allez donc voir comment mettre en place le second de ces cas, qui est plus facile à mettre en place et plus agréable pour l'utilisateur final.

Création du formulaire

Le formulaire doit au moins contenir une page d'introduction, permettant à l'utilisateur de renseigner ses coordonnées ainsi que combien d'équipes il veut inscrire pour chaque catégorie.

 

Figure 56 - Première page du formulaire

Pensez à créer les entrées allant de « Aucune » à « 5 » dans les trois listes déroulantes. Les options peuvent contenir du texte (tel que « Aucune »), mais les valeurs doivent impérativement être numériques (de 0 à 5), afin que certaines règles fonctionnent correctement.

Vous devez ensuite créer les trois pages correspondant aux trois catégories d'équipes. Chacune de ces pages contiendra 5 champs textes, nommés « Nom d'équipe 1 » à « Nom d'équipe 5 ». Pensez à rendre ces 15 champs obligatoires. Vous créerez ensuite les règles permettant d'afficher ou de masquer ces champs en fonction des valeurs sélectionnées dans les trois listes déroulantes de la première page, et les champs masqués perdent leur caractère obligatoire.

 

Figure 57 - Pages des équipes

Création des règles

Maintenant que vous avez créé la structure de votre formulaire, enregistrez-le (si ce n'est déjà fait), puis rendez-vous sous l'onglet « Règles » du formulaire.

Figure 58 - Onglet règles

Cliquez alors sur le bouton « Ajouter une règle ». Un bloc « Règle 1 » s'affiche. Paramétrez-le comme suit :

Figure 59 - Configuration d'une règle

Cette règle se lit de gauche à droite et de haut en bas, comme un texte. Elle signifie simplement « Si le nombre d'équipes juniors est plus petit que 5, alors il faut cacher le nom d'équipe 5 de la page Juniors ».

Répétez cette opération pour les 3 équipes suivantes :

  1. Si « Équipes Juniors » plus petit que 4, alors cacher « Nom d'équipe 4 ».
  2. Si « Équipes Juniors » plus petit que 3, alors cacher « Nom d'équipe 3 ».
  3. Si « Équipes Juniors » plus petit que 2, alors cacher « Nom d'équipe 2 ».

Pour la règle suivante, vous allez cacher toute la page. En effet, s'il y a moins de 1 équipe juniors, c'est qu'il n'y en a aucune. Donc, il ne faut pas afficher la page « Équipes Juniors ».

Figure 60 - Cacher une page

Répétez ensuite ces étapes pour les autres équipes et pages, en suivant la même logique. Vous devez avoir 15 règles au total.

Définissez un message de confirmation ainsi qu'une adresse e-mail expéditrice et enregistrez votre formulaire. Assignez-le ensuite à une page et testez-le. Si tout s'est bien passé, vous devez avoir un résultat similaire à celui ci-dessous.

Lorsqu'aucune équipe n'est sélectionnée, il n'y a aucune page supplémentaire :

Figure 61 - Affichage sans équipe

Lorsqu'on veut inscrire des équipes dans les trois catégories, trois pages supplémentaires s'affichent :

Figure 62 - Affichage avec minimum une équipe par catégorie

Lorsqu'on veut inscrire des équipes d'une seule catégorie, une seule page supplémentaire s'affiche :

Figure 63 - Affichage avec une seule catégorie d'équipes

Et ainsi de suite.

Vous devez également avoir le nombre correspondant de champs textes affichés sur les pages concernées. Par exemple : si l'utilisateur décide d'inscrire 2 équipes de juniors, 3 de seniors et 1 de vétérans, il doit voir deux champs sur la page 2, trois sur la page 3 et un seul sur la page 4.