Contexte
Dans les écrans de recherche avec de multiples critères, l’utilisateur peut avoir besoin de connaître les critères actifs et de les supprimer un à un afin de parfaire sa recherche.
La programmation des champs de saisie de type « jeton texte » permet d'améliorer l'expérience utilisateur.
Conditions
Ajouter un champ de saisie de type « jeton texte » à l’écran de recherche en précisant que les jetons sont supprimables.
Disposer d’une procédure qui va effectuer la recherche.
Programmation
Ajout des jetons
Chaque saisie d’un critère va ajouter un jeton avec le nom du critère concerné.
Pour chaque champ définissant un critère de recherche on appelle la procédure JetonAjouter() :
Ajout du jeton uniquement si le champ a été modifié
Pour les champs combo, ajout du jeton lors de la sélection d’une option
Suppression des jetons
Le clic sur la croix d’un jeton permet de supprimer le jeton ainsi que le critère correspondant en vidant son champ.
Procédure JetonAjouter()
Le traitement diffère selon le type de champ
Procédure JetonSupprimer()
Le traitement diffère selon le type de champ
Complément
Dans l’exemple de mise en œuvre, vous remarquerez que, lors de l'affichage de la fenêtre, la liste est vide. Il faut une action de l'utilisateur (le clic sur le bouton recherche) afin d'afficher l'ensemble des données sans critère.
En effet, il ne faut pas oublier que dans la "vraie vie" le volume de données ne fera qu'augmenter et donc que l'application risque d'être de plus en plus lente au fil du temps.
L'UX, c'est aussi ce type de petit détail. |