.png%3Ftable%3Dblock%26id%3D981293fb-0f9f-4dc5-a8f9-d3cf94336419%26cache%3Dv2?width=1500&optimizer=image)
4ème jour dans WeWeb, je m’attaque donc à la mise en place de filtre sur ma liste de template.
Au départ, je n’ai aucune idée de comment faire ca. Je sais que ca doit être possible (c’est quand même une fonctionnalité basique dans l’affichage d’une collection de données). Je vois bien qu’il est possible de configurer des filtres sur mes données Airtable, mais ce sont des filtre “fixes” - alors que je veux que ce soit mon utilisateur qui détermine les filtre à appliquer.
Comme j’avais repéré qu’il y avait pas mal de tuto sur la chaine youtube de WeWeb, c’est par là que je commence. Bingo, il y a bien une vidéo Add Filters ! Sauf que non, c’est pas çà - parce que c’est juste l’explication de ce que j’avais déjà compris (filtre fixes sur la collections).
Heureusement, un commentaire sous la vidéo pose la même question que moi... Et Weweb répond avec un lien vers un explications supplémentaire. Yes !
Leur exemple utilise un menu déroulant, ce dont je n’ai pas envie. J’envisagerai plutôt quelque chose comme les Filter Chips en Material Design. Mais il me permet d’entrevoir une solution.
Ce qu’il faudrait, c’est que le ‘chip’ modifie en genre de ‘variable’ qui est passée dans le filtre. Hors, j’ai justement vu l’option “variables” dans les “Data” (là où j’ai configuré ma collection Airtable). Quelques clicks, une autres vidéo tuto et me voilà prêt.
Après c’est juste une question de mettre tout ce que je viens d’apprendre ensemble :
- Créer une variable pour un premier filtre (sur les prix) qui reprend deux valeurs : un mininum et un maximum.
- Configurer un filtre sur la collection Airtable (prix ≥ variable[min] ET prix ≤ variable[max])
- Ajouter un element sur ma page et lui configurer un workflow qui change la valeur de la variable.
Au passage, je prends confiance dans l’usage des formules et des effets de style, ce qui me permet de changer l’aspect du ‘chip’ selon la valeur de la variable également.
Et voilà le travail ! Yapluka faire la même chose pour les autre filtres - ce qui me fait cogiter sur les taxonomies (catégories, tags,...) que je pourrai utiliser. Ce sera probablement un un sujet pour demain.
