Formidable Tablesorter - afficher, trier et filtrer vos réponses

Le plugin Formidable Tablesorter, s’appuyant sur la librairie JS éponyme, permet d’afficher les réponses à un formulaire Formidable sous la forme d’un tableau, triable, filtrable, imprimable et exportable.

Installation

Le plugin nécessite, outre Formidable, le plugin Tablesorter dans sa version 2.0 ou supérieure.

Par défaut, le plugin Tablesorter intègre la librairie Tablesorter sur toutes les pages publiques et privées du site. Si l’usage est uniquement pour Formidable Tablesorter, il est recommandé de désactiver, via la configuration du plugin, cette insertion.

Accès au tableau

Une fois le plugin installé, un lien apparaît dans l’espace privé à gauche de la liste des réponses d’un formulaire, ainsi qu’à côté de la page du formulaire.

Lien vers le tableau de réponse
Lien vers le tableau de réponse

En suivant l’un de ces liens, nous accédons au tableau à double entrée.

Par défaut, celui-ci affiche :

  • de haut en bas : toutes les réponses publiées
  • de gauche à droite :
    • l’identifiant et la date de chaque réponse
    • les champs extras éventuels associés à la réponse
    • les champs de la réponse

Il sera possible par la suite de masquer des colonnes et des lignes.

Exemple de tableau
Exemple de tableau

Tri du tableau

Les entêtes de colonnes permettent de trier le tableau selon la valeur d’une colonne.

Masquage de colonnes / de champs

Selon le besoin, il est possible de masquer certaines colonnes. En cliquant sur le bouton “colonnes”, la liste des colonnes apparaît. Il suffit de décocher les colonnes que l’on veut masquer.

Formulaire de masquage de colonne
Formulaire de masquage de colonne

Filtrage des lignes / des réponses

Il est possible de filtrer les réponses selon la valeur des champs. En dessous de chaque entete de colonne se trouve un champ de saisie. Il suffit d’y mettre la valeur que l’on veut conserver, puis de faire un retour ligne : seules les lignes contenant la valeur saisie s’afficheront désormais. Le filtrage est souple :

  • pour des champs de type numérique, il est possible d’utiliser les opérateurs de comparaison. Mettre <10 pour afficher uniquement les réponses donnant une valeur inférieure à 10.
  • pour des champs de type texte, ne seront affichés que les réponses contenant la valeur saisie, mais il n’est pas nécessaire que la valeur du champ soit strictement identique à cette valeur. Ainsi, écrire “janvier” pemettra d’afficher les réponses ayant “janvier 2019” comme “janvier 2020”.
Un tableau aux valeurs filtrées
Un tableau aux valeurs filtrées

Sauvegarde des filtres et des masquages

Les paramètres de filtres et de masquages sont conservés localement par le navigateur. Ils seront donc repris à la prochaine consultation depuis le même navigateur. Le navigateur doit supporter le système WebStorage.

Impression

Un bouton d’impression permet d’imprimer le tableau filtré, sans les colonnes et les lignes masqués.

Export

Un bouton d’export permet d’exporter en .csv le tableau filtré, pour ensuite l’ouvrir dans un tableur.

À faire

  • Ajouter une pagination pour les longs tableaux
  • Améliorer la production des cellules pour régler plus finement le tri (notamment pour les champs de date)
  • Améliorer les CSS tant pour l’affichage que pour l’impression

updated on 3 December 2019

Discussion

Aucune discussion

Comment on this article

Who are you?
  • [Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom