Aller au contenu principal

LgGridSelectionColumn

LgGridSelectionColumn ajoute une case à cocher par ligne pour la sélection multiple ou un comportement radio pour la sélection unique.

<Columns Context="item">
<LgGridSelectionColumn SingleSelection="false" />
<LgGridTextColumn @bind-Value="item.Number" Title="#OrderNumber" />
</Columns>
  • Package NuGet : Lagoon.UI.GridView

Les paramètres communs sont documentés dans LgGridBaseColumn.

Paramètres spécifiques​

NomTypeDéfautDescription
SingleSelectionboolfalseSélection d'une seule ligne : cocher une ligne désélectionne la précédente.
DisableSelectAllboolfalseDésactive le bouton « tout sélectionner » de l'en-tête de la colonne.
CanSelectSelectorFunc<TItem, bool>nullIndique, pour chaque ligne, si l'utilisateur peut la sélectionner (case à cocher, clic sur la ligne, « tout sélectionner ») ; null : toutes les lignes sont sélectionnables. Voir Lignes sélectionnables selon une condition.

Utilisation​

Démonstration​

Essayez ce composant dans le showcase Lagoon.

Sélection multiple ou simple​

GridSelectionColumnPage.razor
@inherits LgPage

<LgGridView StateId="orders-selection-column"
Items="_orders"
KeyField="Id"
SelectableRows="true"
Selection="_selection"
OnRowSelection="OnRowSelectionAsync"
Features="@(GridFeature.Default | GridFeature.Delete)"
OnDelete="OnDeleteAsync"
Title="#OrdersGridTitle">
<Columns Context="item">
<LgGridSelectionColumn Key="selection" DisableSelectAll="true" />
<LgGridTextColumn @bind-Value="item.Number" Title="#OrderNumber" />
</Columns>
</LgGridView>
GridSelectionColumnPage.razor.cs
public partial class GridSelectionColumnPage : LgPage
{
// Collection liée à la grille : elle contient les lignes cochées par l'utilisateur.
private ICollection<OrderRow> _selection = new List<OrderRow>();

// Mémorise la sélection courante pour piloter les actions externes à la grille.
private Task OnRowSelectionAsync(GridViewSelectionEventArgs<OrderRow> args)
{
_selection = args.Selection;
return Task.CompletedTask;
}

// Traite la suppression déclenchée par la toolbar de sélection lorsque GridFeature.Delete est actif.
private Task OnDeleteAsync(GridViewSelectionActionEventArgs<OrderRow> args)
{
foreach (OrderRow item in args.Selection.ToList())
{
_orders.Remove(item);
}
return Task.CompletedTask;
}
}

Pour une sélection radio, ajoutez SingleSelection="true". En mode distant, gardez DisableSelectAll="true" si le « tout sélectionner » ne doit pas porter sur des lignes non chargées côté client.

Lignes sélectionnables selon une condition​

CanSelectSelector reçoit l'élément de la ligne et renvoie false pour une ligne que l'utilisateur ne peut pas sélectionner :

GridSelectionColumnPage.razor
<Columns Context="item">
<LgGridSelectionColumn CanSelectSelector="@((OrderRow order) => order.Status != OrderStatus.Closed)" />
<LgGridTextColumn @bind-Value="item.Number" Title="#OrderNumber" />
</Columns>

Pour une ligne refusée :

  • la case à cocher est désactivée ; au survol de la ligne, l'icône NoEntry (cercle barré) remplace la coche ;
  • le clic sur la ligne (SelectableRows="true") ne la sélectionne pas et ne lève pas OnRowSelection ; en SingleSelection, la ligne sélectionnée auparavant le reste ;
  • « tout sélectionner » l'ignore.

Une ligne refusée déjà sélectionnée (sélection liée initiale, ajout par le code) garde une case active : l'utilisateur peut la désélectionner, mais pas la sélectionner de nouveau.

La condition ne s'applique qu'à l'utilisateur : SelectItem() de la grille, la collection liée à Selection et la collection Selection des arguments de OnRowSelection peuvent ajouter n'importe quel élément.

attention

Lisez l'élément depuis le paramètre de la lambda (order), jamais depuis la variable de contexte de <Columns> (item) : le fragment <Columns> n'est évalué qu'une fois, la variable de contexte ne désigne pas la ligne.

Filtre​

Aucun filtre intégré.

Énumérations associées​

L'énumération héritée GridFeature, utilisée pour activer les actions de sélection comme Delete, est documentée dans LgGridView.

Référence complète

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

Composants liés​