Widgets de tableaux interactifs

Prev Next

Ajouter et modifier un widget « Table interactive »

Dans cet article, vous apprendrez…

  • Qu'est-ce qu'un widget « Table interactive » ?
  • Comment utiliser les widgets « Table interactive »
Note

Complete this tutorial if you have not yet created a table.

Ajouter le widget « Table interactive »

Le widget « Table interactive » se trouve dans le menu déroulant « Intégrer » de la barre d'outils de l'éditeur d'application.

Source de données

Le widget « Table interactive » permet de visualiser les données provenant des sources suivantes :

  • Variable: toute variable de l'application (la variable doit être un tableau d'objets).
  • Tableau: un tableau Tulip existant.
  • Requête de tableau: une requête au sein d'un tableau Tulip permettant de renvoyer des enregistrements filtrés.

Espace réservé / variable d'enregistrement lié

Un widget de tableau interactif peut également inclure un espace réservé lié ou une variable, selon la source de données. Il s'agit d'un conteneur destiné à un seul objet, le tableau interactif représentant quant à lui une liste d'objets. Si un espace réservé lié ou une variable est défini, la sélection d'une ligne dans le tableau chargera les données de cette ligne dans le conteneur.

Champs

Les champs sont représentés par les champs du tableau Tulip ou de la requête de tableau sélectionnés, ou par les clés d’objet de la variable sélectionnée.

Pour ajouter des champs, cochez les cases correspondantes dans la liste déroulante ou cliquez sur « Tout sélectionner ».

Tulip recommande de ne pas afficher plus de 20 champs par étape pour une expérience utilisateur et des performances de l’application optimales.

Pour réorganiser les champs, cliquez sur les libellés et faites-les glisser dans les propriétés du widget. Pour modifier la largeur des champs, faites glisser les lignes de chaque champ dans l’éditeur d’application ou le lecteur.

Retour à la ligne

Le texte d’une cellule de tableau interactif peut être configuré pour s’ajuster à la largeur. Lorsque l’ajustement est activé, les textes plus longs créent un espace vertical supplémentaire. Lorsqu’il est désactivé, le texte est tronqué et remplacé par des points de suspension lorsqu’il approche du bord du champ.

Pour activer ou désactiver le retour à la ligne dans l'en-tête et le texte d'enregistrement, utilisez les boutons de bascule dans le volet de contexte.

Text Wrap.png

Bouton de sélection

Un bouton de sélection peut être ajouté au widget « Table interactive » afin d’indiquer plus clairement quelle ligne est sélectionnée si un espace réservé lié ou une variable a été ajouté.

Filtres

Des filtres statiques ou dynamiques peuvent être ajoutés au widget « Table interactive » afin de filtrer les données qu’il contient. Les filtres peuvent être configurés pour correspondre à toutes les conditions ou à n’importe laquelle d’entre elles, et peuvent être comparés à une valeur statique, à des variables, à des informations sur l’application et à un champ d’enregistrement du tableau.

Tri

Le tri du tableau interactif en fonction d'un champ spécifique peut être configuré à l'aide de l'option « Trier par », par ordre croissant ou décroissant (selon le type de données). Vous pouvez également ajouter plusieurs méthodes de tri pour chaque champ du widget de tableau.

Les champs déjà ajoutés dans l’option « Trier par » peuvent également être triés dans le lecteur. Cliquez sur l’icône ^ pour inverser l’ordre de tri.

Performance recommendation: Do not sort by filtered fields

In order to ensure a performant app and user experience, Tulip recommends not sorting the embedded table by any fields on which the embedded interactive table is filtered.

Index des lignes

Un index de ligne peut être ajouté au widget « Table interactive » pour indiquer le nombre de lignes sur le côté gauche. Ce nombre correspond au contenu actuellement affiché ou rendu par le widget.

Nombre de lignes par page

Le nombre de lignes par page du widget « Table interactive » peut être ajusté ici. Si vous augmentez ce nombre au-delà d’une certaine limite, une fonctionnalité de défilement vertical sera ajoutée au widget.

Déclencheurs

Les déclencheurs peuvent être configurés pour s'exécuter lorsqu'une ligne est sélectionnée dans le widget « Table interactive ». Pour ajouter un déclencheur, cliquez sur le bouton + situé à côté de l'étiquette « Déclencheur » dans le menu des propriétés du widget.

Les déclencheurs peuvent exploiter les informations de la ligne sélectionnée en définissant un « enregistrement/variable lié » et en l'utilisant dans le corps du déclencheur.

Taille de police et taille de police de pagination

La taille de police des données affichées dans le tableau et celle des libellés des numéros de page peuvent être ajustées dans le menu des propriétés du widget.

Mise en forme conditionnelle

Dans l’éditeur d’application, la mise en forme conditionnelle permet aux utilisateurs de sélectionner des champs du tableau comme arguments pour les règles de mise en forme dans le widget de tableau interactif

Les règles de mise en forme conditionnelle affichent une option « Dupliquer » lorsqu'il y a moins de 20 règles dans la liste.

image.png

Pour en savoir plus sur la mise en forme conditionnelle, cliquez ici.

Lectures complémentaires

{{snippet.Avez-vous trouvé ce que vous cherchiez ?}}