Aller au contenu principal

LgGridCustomColumn

LgGridCustomColumn<TColumnValue> est la colonne générique de LgGridView : elle accepte une valeur de n'importe quel type. Par défaut la valeur est affichée sous forme de texte (DisplayFormat est appliqué si la valeur implémente IFormattable, sinon ToString()) ; les templates CellContent et EditCellContent permettent d'en personnaliser le rendu.

<Columns Context="item">
    <LgGridCustomColumn @bind-Value="item.Reference" Title="#Reference">
        <CellContent Context="cell">
            <LgIcon IconName="@IconNames.All.Tag" />
            @cell.Value.Code
        </CellContent>
    </LgGridCustomColumn>
</Columns>
  • Espace de noms : Lagoon.UI.Components
  • Hérite de : LgGridBaseValueColumn<TItem, TColumnValue>
  • Package NuGet : Lagoon.UI.GridView
Pas de filtre par défaut

Le type de la valeur étant inconnu, la colonne n'a aucun filtre : la cellule de filtre reste vide et un DefaultFilter éventuel est ignoré. Pour filtrer, utilisez la colonne spécialisée correspondant au type (LgGridTextColumn, LgGridNumericColumn, LgGridDateColumn, LgGridBooleanColumn, LgGridEnumColumn…) ou fournissez votre propre FilterCellContent. Le tri, lui, reste disponible dès qu'une clé de tri est déterminée (SortSelector ou ValueSelector).

Les paramètres de filtre (AllowFilter, DefaultFilter, FilterExpression, FilterShowAllItems, FilterDisableSelection, FilterCellContent, MinSearchFilterCharacter) ne sont pas déclarés sur cette colonne : ils appartiennent aux colonnes filtrables.

Colonne texte

Si la valeur liée est une string, préférez LgGridTextColumn : elle évite d'avoir à raisonner sur TColumnValue et conserve le filtre texte.

Utilisation​

Démonstration​

Essayez ce composant dans le showcase Lagoon.

Valeur métier et rendu personnalisé​

CellContent reçoit un contexte exposant la valeur de la cellule (cell.Value) et la ligne (cell.Item). Le Context par défaut se nomme context.

GridCustomColumnPage.razor
@inherits LgPage

<LgGridView StateId="orders-custom-column" Items="_orders" Title="#OrdersGridTitle">
    <Columns Context="item">
        <LgGridCustomColumn @bind-Value="item.Reference" Title="#Reference">
            <CellContent Context="cell">
                <LgIcon IconName="@IconNames.All.Tag" />
                @cell.Value.Code (@cell.Item.CustomerName)
            </CellContent>
        </LgGridCustomColumn>
        <LgGridCustomColumn @bind-Value="item.Identifier" Title="#Identifier" DefaultVisible="false" />
    </Columns>
</LgGridView>
GridCustomColumnPage.razor.cs
public partial class GridCustomColumnPage : LgPage
{
    private List<OrderRow> _orders = new();

    private sealed class OrderRow
    {
        // Type métier : affiché via le template CellContent.
        public OrderReference Reference { get; set; }

        // Type non textuel : la colonne affiche le résultat de ToString().
        public Guid Identifier { get; set; }

        public string CustomerName { get; set; }
    }
}
Capture du contexte de ligne

Le fragment Columns de la grille n'est évalué qu'une seule fois (avec un élément modèle) : dans un template de cellule, n'utilisez pas la variable déclarée par <Columns Context="…"> mais cell.Item.

Valeur calculée avec ValueSelector​

ValueSelector (Expression<Func<TItem, TColumnValue>>) fournit la valeur de la colonne par ligne sans @bind-Value, donc sans capturer le contexte de <Columns>. C'est un fournisseur complet : la valeur retournée alimente l'affichage, le tri et le groupe. Une expression calculée (ci-dessous) rend la colonne lecture seule ; un chemin membre simple (row => row.Reference) resterait éditable. Sans @bind-Value, précisez TItem.

GridComputedColumnPage.razor
@inherits LgPage

<LgGridView StateId="orders-computed-column" Items="_orders" Title="#OrdersGridTitle">
    <Columns Context="item">
        @* Total = quantité × prix unitaire : valeur dérivée, affichée en lecture seule. *@
        <LgGridCustomColumn TItem="OrderRow" TColumnValue="decimal"
                            Title="#LineTotal"
                            DisplayFormat="C2"
                            ValueSelector="@(i => i.Quantity * i.UnitPrice)"
                            SortSelector="@(i => i.Quantity * i.UnitPrice)" />
    </Columns>
</LgGridView>
Distant vs local

Une clé calculée ne se traduit pas en requête distante : le tri reste opérant en local. Un chemin membre simple, lui, se traduit et fonctionne aussi côté serveur. Voir la section Sélecteurs par-ligne de LgGridTextColumn.

Filtre​

Aucun : OnGetFilterType renvoie null, la colonne affiche une cellule de filtre vide.

Référence complète

Fiche générée depuis les sources : Référence API — LgGridCustomColumn.

Composants liés​