---
sidebar_position: 3
title: Ajouter l'action Supprimer
---

## Ajouter l'action Supprimer

Afin de supprimer un élément nous allons donc modifier la grille afin d'ajouter une action permettant la supression de notre élement.

Pour cela nous allons modifier la colonne contenant déjà notre lien de navigation vers la modification.

Ouvrer le fichier `Pages/List.razor` et ajouter les modification en surbrillance commme suite :

```cshtml title="Pages/List.razor"
...

    <DataGridColumn TItem="Item" Field="@nameof(Item.CreatedDate)" Caption="Created date" DisplayFormat="{0:d}" DisplayFormatProvider="@System.Globalization.CultureInfo.GetCultureInfo("fr-FR")" />
    <DataGridColumn TItem="Item" Field="@nameof(Item.Id)" Caption="Action">
        <DisplayTemplate>
            <a href="Edit/@(context.Id)" class="btn btn-primary"><i class="fa fa-edit"></i> Editer</a>
			// highlight-next-line
            <button type="button" class="btn btn-primary" @onclick="() => OnDelete(context.Id)"><i class="fa fa-trash"></i> Supprimer</button>
        </DisplayTemplate>
    </DataGridColumn>
</DataGrid>
```

Dans le code de notre page `Pages/List.razor.cs` ajouter la méthode :

```csharp title="Pages/List.razor.cs"
...

private void OnDelete(int id)
{

}
```