Construire une liste déroulante dépendante

Vous avez vu dans un article précédent ici comment créer des menus déroulants ou listes déroulantes.

Regardons comment faire pour faire un menu déroulant conditionnel, plus communément appelé liste déroulante conditionnelle, liste déroulante dépendante ou encore liste déroulante en cascade.

Si vous cherchez sur la communauté AppSheet, en anglais l’expression usuelle est “dependent dropdown”.

Etape 1 : La structure des tables

Avec AppSheet, il est indispensable de définir une colonne qui portera la condition. Il s’agira donc forcément d’une valeur inscrite dans une colonne réelle.

Ensuite, une deuxième colonne portera la liste dépendante.

Ceci implique que : 

• la table des items comporte la désignation des items, ainsi que la catégorie à laquelle ils appartiennent
• la table des mouvements porte une colonne de catégorie (qui est la condition de notre liste), puis une colonne d’item (qui dépendra de notre catégorie choisie)

Etape 2 : Définir la condition

Prenons un exemple simple : imaginons que dans notre application, nous voulons sélectionner un item en fonction de sa catégorie. Dans ce cas, la condition sera la Catégorie, et notre choix d’Item dépendra de celle-ci.

Pour établir notre condition, le plus simple est encore de définir une colonne soit de type Enum, soit de type Ref, qui pointe vers une table dédiée. Je vous recommande cette dernière option.

Voici à quoi cela ressemble dans la table qui des mouvements :

Pour accéder aux paramètres du champ, il faut cliquer sur le petit crayon noir qui se trouve à côté du nom de la colonne. Il est noir pour les colonnes réelles, et bleu pour les colonnes virtuelles.

Etape 3 : Conditionner la liste

Pour obtenir une liste, il faut tout d’abord définir que la colonne Item est de type Ref, comme on l’a fait précédemment pour les catégories.

A ce stade, aucune condition n’est encore opérée. Il faut maintenant la mettre en place.

Cela se passe dans la section Data Validity, qui est un peu plus bas dans la même fenêtre.

 Et c’est ici que la magie opère ! 

Explication du tour de magie

Le champ Valid_If de la section Data Validity (“Validation des données”) autorise au choix une liste, ou une condition du type VRAI/FAUX. C’est bien la première option qui nous intéresse.

L’expression FILTER() qui est présentée ici renvoie la liste des ITEMS pour lesquels la catégorie correspond à celle qui est choisie.

Note: Nous ferons un article dédié à l’utilisation de FILTER(), qui mérite d’y passer un peu de temps.

Appli démo : pour comprendre

Afin de vous aider à comprendre comment s’articulent les différentes options de menu, votre serviteur a conçu une application démo.

Dans cette appli, tous les cas de figure sont utilisés : les listes Enum, les listes Ref, et les listes dépendantes.

Pour regarder sous le capot : c’est ici que ça se passe !

Conclusion

Cet article conclut une série de deux articles dédiés aux menus ou listes déroulantes : dans celui-ci, nous avons vu la méthode consistant à appliquer une condition par le biais de la propriété Valid_If de la colonne portant la liste.

Si vous souhaitez en savoir plus sur les listes dépendantes, ce sujet fait aussi l’objet d’un article à part sur la documentation officielle d’AppSheet sur ce lien (en anglais).

Vous avez un projet pour une appli ou une formation AppSheet ? C’est ici que ça se passe !