You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

37 lines
1.2 KiB

---
sidebar_position: 3
title: Add Delete Action
---
## Add Delete Action
In order to delete an element we will therefore modify the grid in order to add an action allowing the deletion of our element.
For this we are going to modify the column already containing our navigation link to the modification.
Open the `Pages/List.razor` file and add the highlighted changes as follows:
```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>
```
In the code of our page `Pages/List.razor.cs` add the method:
```csharp title="Pages/List.razor.cs"
...
private void OnDelete(int id)
{
}
```