BlazorDataGrid 1.1.0

il faut ajouter dans le fichier _Imports.razor

@using BlazorDataGrid

Et dans le fichier Startup.cs dans la méthode public void ConfigureServices(IServiceCollection services)

services.AddScoped<AppState, AppState>();

Exemple d'utilisation

Le composant <BlazorDataGrid> accepte les paramètres suivant :

• Items : La liste qui remplie la datagrid
• PageSize : Le nombre de résultat par page. Le paramètre est obligatoire
• ShowTotalResult : Un booléen pour afficher ou non le nombre de résultats
• BlazorDataGridColumn : Un composant permettant d'afficher les header
• GridRow : Les lignes de la datagrid

Le composant <BlazorDataGridColumn> accepte les paramètres suivant :

• DataGridColumn : Le composant détaillant chaque header

Le composant <DataGridColumn> accepte les paramètres suivant :

• Items : Il faut passer le même paramètre que pour le composant <BlazorDataGrid>
• ColumnName : Le nom réel de la colonne sur laquelle se base le filtre et le tri
• DisplayColumnName : (non obligatoire) Le nom qui sera affiché dans le header. Il est possible de passer le contenu du header entre les balises à la place
• Filter : true ou false pour afficher ou non le champ filtre sur la colonne

Exemple de code :

<BlazorDataGrid Items="@forecasts" PageSize="5" ShowTotalResult="true">
    <BlazorDataGridColumn>
        <DataGridColumn Items="@forecasts" ColumnName="Date" Filter="true"><strong>Date</strong></DataGridColumn>
        <DataGridColumn Items="@forecasts" ColumnName="TemperatureC" DisplayColumnName="TemperatureC" Filter="true"></DataGridColumn>
        <DataGridColumn Items="@forecasts" ColumnName="TemperatureF" DisplayColumnName="TemperatureF"></DataGridColumn>
        <DataGridColumn Items="@forecasts" ColumnName="Summary" DisplayColumnName="Summary"></DataGridColumn>
    </BlazorDataGridColumn>
    <GridRow>
        <td>@context.Date.ToShortDateString()</td>
        <td>@context.TemperatureC</td>
        <td>@context.TemperatureF</td>
        <td>@context.Summary</td>
    </GridRow>
</BlazorDataGrid>

Aperçu