Mashup Builder > Widgets > Widgets hérités > Widget Grille (hérité)
Widget Grille (hérité)
Le widget Grille vous permet d'afficher n'importe quel jeu de données dans une vue de grille. Pour représenter les données, plusieurs solutions sont possibles, notamment l'application d'un contexte de couleur par colonne et le rendu d'images dans une cellule. Vous pouvez configurer les rendus de base, y compris l'ordre des colonnes, les colonnes à afficher, les en-têtes de colonne et le formatage d'état par l'intermédiaire de la boîte de dialogue de configuration du widget Grille, en utilisant la sélection Configure Grid Columns.
Vous pouvez redimensionner les colonnes de la grille dans l'environnement d'exécution et également trier les données en cliquant sur l'en-tête d'une colonne.
Grille modifiable
Un paramètre spécial applicable au widget et accessible dans l'option Configure Grid Columns permet de modifier les lignes/colonnes de la grille. Vous pouvez ainsi modifier les valeurs d'une grille, puis transférer l'intégralité du contenu dans un service. De même, si vous affichez Selected Row dans votre grille, cette ligne spécifique peut être transférée. La taille de votre table pouvant impacter l'utilisation de la mémoire, il est conseillé d'utiliser Selected Row.
* 
Les styles du widget et les propriétés communes aux widgets ne sont pas inclus dans la table ci-dessous.
Nom de propriété
Description
Type de base
Valeur par défaut
Liaison possible ? (O/N)
Localisable ? (O/N)
CustomClass
Classe CSS définie par l'utilisateur à appliquer à la div supérieure du widget. Plusieurs classes peuvent être spécifiées, séparées par une espace.
STRING
n/a
O
N
RowFormat
Les règles facultatives pour appliquer le formatage (d'état) dynamique par ligne peuvent être remplacées par le formatage d'état par cellule.
STATE FORMATTING
Formatage de l'état.
N
N
MultiSelect
Permet la sélection de plusieurs éléments.
BOOLEAN
Faux
N
N
IsEditable
Autorise ou non la modification des valeurs de la grille.
BOOLEAN
Faux
N
N
AutoSelectFirstRow
La première ligne est automatiquement sélectionnée lors du chargement initial des données.
BOOLEAN
Faux
N
N
CellTextWrapping
Permet le renvoi à la ligne des valeurs des cellules.
BOOLEAN
Faux
N
N
Données
Table d'informations utilisée comme source de données pour cette propriété.
INFOTABLE
n/a
O
N
CurrentScrollTop
Défilement vers le haut initial.
NUMBER
0
O
N
ScrollTop
Défilement vers le haut pour affecter.
NUMBER
0
O
N
EditedTable
Table modifiée à l'aide de la grille.
INFOTABLE
n/a
O
N
RowHeight
Hauteur des lignes.
NUMBER
30
N
N
ShowAllColumns
Affiche toutes les colonnes disponibles. Vous devez utiliser ShowAllColumns si votre table d'informations n'utilise aucune forme de données.
* 
Les fonctionnalités de rendu, telles que la modification de cellule et l'application de styles, ne sont pas disponibles lorsque cette propriété est activée.
BOOLEAN
Faux
N
N
ShowDataLoading
Montre le chargement des données.
BOOLEAN
Vrai
N
N
DoubleClicked
Evénement. Permet de sélectionner l'objet de données avec un seul clic, mais permet toujours d'utiliser le double clic pour un autre événement, par exemple pour ouvrir un lien de navigation.
n/a
n/a
O
N
Visible
Le widget est-il visible à l'exécution ?
BOOLEAN
Vrai
O
N
Configuration d'une grille
Après avoir lié un service de données à la grille, ouvrez la boîte de dialogue Grid Column Configuration. Vous pouvez choisir les colonnes à afficher en cochant ou en décochant les cases en regard de chaque colonne (vrai = afficher, faux = masquer). Réorganisez les colonnes affichées en les faisant glisser vers le haut ou le bas dans la liste.
Le titre des colonnes est automatiquement affecté par la forme de données du service de données. Vous pouvez cependant renommer chacune des colonnes depuis la boîte de dialogue de configuration correspondante. Pour chaque colonne, vous pouvez également effectuer les actions suivantes :
Choisir le programme de rendu de la cellule (utilisé pour le traitement de types de données spécifiques dans les données à afficher ; recommandé)
Définir une largeur automatique ou une largeur fixe
Définir l'alignement du texte
Définir la stylisation (Fixe ou Formatage de l'état)
Désigner une colonne comme modifiable (avec ou sans validation)
Si vous souhaitez appliquer un style fixe (non dynamique), sélectionnez Définition de style fixe, puis choisissez une définition de style précédemment définie. Pour appliquer un formatage dynamique (contexte de couleurs ou autre, en fonction des données renvoyées dans une ligne), choisissez Formatage basé sur l'état.
Avec le formatage basé sur l'état, vous configurez individuellement chaque colonne de données, en appliquant un style spécifique à la colonne en fonction des données contenues dans la ligne. Pour chaque colonne pour laquelle vous souhaitez définir un formateur d'état, vous devez effectuer les opérations suivantes :
Sélectionnez la colonne dont dépendra le formatage. Il peut s'agir de n'importe quelle colonne (masquée ou non) dans le service de données renvoyé.
Sélectionnez la définition d'état que vous souhaitez utiliser (une par colonne et elle doit correspondre au type de données du champ dépendant).
Acceptez les valeurs par défaut pour la définition d'état ou remplacez-les spécifiquement pour la définition et le rendu de cette grille.
Lorsque la grille est modifiable, vous pouvez également rendre modifiables des colonnes spécifiques. Vous avez également la possibilité d'ajouter une validation basée sur les noms des colonnes à l'aide de comparaisons JavaScript.
Exemple :
Validation - Column1 > 5 && Column3 < 10
Message - You must have Col 1 > 5 and Col 3 < 10
Est-ce que cela a été utile ?