Claude Couderc Consulting

Créer des listes en cascade dans PowerApps

Résultat des listes en cascade

Cet exercice fait partie d’une série consacrée à l’apprentissage de PowerApps. C’est donc un entraînement purement pédagogique, qui sert à vous familiariser avec l’interface, les concepts, etc.

Objectif

Les listes en cascade sont basées généralement sur au moins deux listes déroulantes. Il y a une relation de dépendance entre ces listes déroulantes.

Par exemple, une première liste des départements énumère les départements. Lorsque l’utilisateur sélectionne un département dans cette liste déroulante, la seconde liste déroulante affiche les villes du département.

Ce mécanisme est très pratique. En effet, il réduit la quantité d’informations exposées à l’utilisateur. Celui-ci peut donc faire son choix plus efficacement.

Dans l’exemple de cet exercice, une liste déroulante va afficher la liste des identifiants des fournisseurs de la liste lstAffaires. Une seconde liste déroulante affichera la liste des affaires du fournisseur sélectionné.

Prérequis

  • La liste lstAffaires doit exister dans votre site SharePoint.

Créer une application PowerApps

Ouvrez le site web Microsoft PowerApps et identifiez-vous avec votre compte de tenant.

https://make.powerapps.com/

Dans le volet de navigation (à gauche), cliquez sur Applications.

Dans la bannière du volet central (en haut), cliquez sur Créer une application (en haut, vers la gauche).

Dans le menu qui s’affiche, cliquez sur Zone de dessin : un nouvel onglet s’ouvre.

Dans le volet central du nouvel onglet et sous Démarrer avec un modèle ou un canevas vierge, cliquez sur Disposition de la tablette sous Application vide, puis patientez.

Pour vous aider, regardez la copie d’écran ci-dessous.

Démarrer avec un modèle tablette
Démarrer avec un modèle tablette

Notez que vous auriez pu aussi bien choisir le mode téléphone sous Application vide, car les manipulations sont strictement identiques. Il s’agit d’un choix purement arbitraire.

Si la fenêtre Bienvenue dans PowerApps Studio s’ouvre, cliquez sur le bouton Ignorer. Éventuellement, vous pouvez aussi cocher la case Ne plus afficher ce message.

Enregistrer et renommer l’application

Cliquez sur le ruban Fichier puis dans le volet de gauche, cliquez sur Enregistrer.

Dans le volet central (vers la droite), remplacez le nom de l’application (“Application”) par canAffaires.

En bas, cliquez sur le bouton Enregistrer.

Si vous ne voyez pas le bouton Enregistrer, c’est parce que vous êtes dans les Paramètres de l’application. Dans ce cas, cliquez sur Enregistrer dans le volet de gauche.

Cliquez sur la flèche en haut et à gauche pour revenir à l’accueil.

Afin d’éviter toute ambiguïté, il est indiqué systématiquement le nom du contrôle. Toutefois, vous pouvez aussi sélectionner un contrôle dans la représentation graphique de l’écran au milieu.

Se connecter aux données

Dans le menu du haut, cliquez sur le ruban Affichage.

Sous Affichage, cliquez sur Source de données : le volet Source de données apparaît à gauche.

En haut du volet Source de données, cliquez dans la zone Rechercher…

Dans cette zone de recherche, saisissez SharePoint puis cliquez sur l’icône bleue SharePoint aide les organisations à partager : ne cliquez pas sur les icônes violettes Common Data Service.

Dans la liste qui s ‘affiche, cliquez sur la première connexion SharePoint : la liste des sites récents apparaît.

Patientez quelques instants.

Dans cette liste, sélectionnez votre site SharePoint.

Sous Choisir une liste, cochez la case lstAffaires, puis cliquez sur Se connecter (en bas du volet).

Lorsque la connexion est terminée, cliquez sur la croix en haut et à droite du volet Source de données pour fermer ce volet.

Insérer et définir un premier contrôle Liste déroulante (Dropdown)

Dans l’arborescence (à gauche), cliquez sur l’écran Screen1.

Cliquez sur le ruban Insérer puis cliquez sur Contrôles puis cliquez sur Liste déroulante : une liste déroulante apparaît sur l’écran Screen1. Le nom du contrôle s’affiche dans l’arborescence (à gauche), sous Screen1: Dropdown1.

Dans l’arborescence, double-cliquez sur Dropdown1, et nommez-le : ListeDeroulanteFournisseur.

Ensuite, définissez les propriétés suivantes de ListeDeroulanteFournisseur :

Items = Distinct(lstAffaires.FournisseurID;FournisseurID)

Cette liste déroulante affiche les identifiants des fournisseurs. Chaque identifiant est un nombre qui se termine par 5.

La fonction Distinct() élimine les doublons d’une liste de valeurs. Par ailleurs, elle retourne une table à une colonne des résultats avec des valeurs en double supprimées. Le nom de la colonne est result. Dans le cas présent, la fonction dédoublonne les valeurs en double de la colonne FournisseurID.

Pour en savoir plus sur Distinct(), consultez la page de Microsoft dédiée aux fonctions : https://coudr.com/powfn.

Petite astuce : la fonction Dictinct() permet de forcer l’alimentation d’une liste déroulante. En effet, il arrive que PowerApps ne renseigne pas le champ de la liste déroulante lors du premier accès à l’écran. L’utilisation, même temporaire, de cette fonction oblige PowerApps à alimenter la liste déroulante.

Insérer et définir un second contrôle Liste déroulante (Dropdown)

Dans l’arborescence (à gauche), cliquez sur l’écran Screen1.

Cliquez sur le ruban Insérer puis cliquez sur Contrôles puis cliquez sur Liste déroulante : une liste déroulante apparaît sur l’écran Screen1. Le nom du contrôle s’affiche dans l’arborescence (à gauche), sous Screen1: Dropdown1.

Déplacez légèrement le contrôle sous le premier, afin de bien voir les deux contrôles.

Dans l’arborescence, double-cliquez sur Dropdown1, et nommez-le : ListeDeroulanteAffaires.

Ensuite, définissez les propriétés suivantes de ListeDeroulanteAffaires :

Items = Distinct(Filter(lstAffaires;FournisseurID = ListeDeroulanteFournisseur.Selected.Result);Titre)

Cette liste déroulante affiche les affaires qui dépendent du fournisseur sélectionné dans la liste déroulante précédente.

Insérer et définir un contrôle Formulaire d’affichage (Display Form)

Dans l’arborescence (à gauche), cliquez sur l’écran Screen1.

Cliquez sur le ruban Insérer puis cliquez sur Formulaires puis cliquez sur Affichage : un formulaire d’affichage apparaît sur l’écran Screen1.

Ensuite, définissez les propriétés suivantes du formulaire d’affichage :

DataSource = lstAffaires

Ensuite, cliquez sur le lien Choisissez les champs à ajouter à partir du volet Personnalisation. Ce lien se trouve dans le formulaire.

Dans le volet Champs qui s’ouvre, cliquez sur Ajouter un champ.

Cochez :

  • Titre
  • Responsable
  • MontantHT

Puis cliquez sur le bouton Ajouter.

Fermez le volet Champs.

Dans l’onglet Propriétés, modifiez la valeur de la propriété Colonnes de 3 à 1 : les champs se retrouvent l’un en-dessous de l’autre.

Ensuite, définissez les propriétés suivantes du formulaire d’affichage :

Item = LookUp(lstAffaires; Titre = ListeDeroulanteAffaires.Selected.Result)
Heigh = 358
Width = 436
X = 146
Y = 200

La fonction LookUp() utilise 2 paramètres. Le premier paramètre indique la source de données utilisée. Le second paramètre est une formule de filtre.

Dans ce scénario, la fonction LookUp() cherche dans la liste lstAffaires, l’élément dont le titre est égal au choix de la seconde liste déroulante.

Enregistrer et tester l’application

Cliquez sur le ruban Fichier puis dans le volet de gauche, cliquez sur Enregistrer.

Cliquez sur la flèche en haut et à gauche pour revenir à l’accueil.

Appuyez sur la touche F5.

Procédez à des tests.

Résultat des listes en cascade
Résultat des listes en cascade

Une fois vos vérifications terminées, fermez la fenêtre en cliquant sur la croix en haut et à droite ou sur Échap du clavier.

Fin des manipulations

Fermez l’onglet de votre application : un pop-up apparaît pour confirmer la fermeture. Dans ce pop-up, cliquez sur le bouton Quitter la page. Vous retrouverez votre application sous le menu Applications de l’accueil du site PowerApps.

L’exercice est terminé.

Bonus : tri des éléments des listes déroulantes.

Les listes déroulantes ne sont pas triées.

Vous devez les trier dans l’ordre alphabétique du résultat.

Pour cela, utilisez la fonction SortByColumns() pour trier les éléments des listes déroulantes en ordre descendant.

Pour savoir comment utiliser la fonction SortByColumns(), consultez la page de Microsoft dédiée aux fonctions : https://coudr.com/powfn.

Résumé

Dans cet exercice, vous avez appris comment réaliser des listes en cascade dans PowerApps, à partir d’une source de données.

Vous avez aussi vu comment afficher le résultat d’une sélection d’une liste déroulante.

Article mis à jour le 28.09.2019.

Claude COUDERC

Ajouter un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.