Show DetailRow on RowDoubleClicked Blazorise DataGrid

Question

Recently I started using Blazorise as a great library in Blazor. I use Blazorise DataGrid component to show my master/detail data in which you click master row and DataGrid shows detail row/rows. In last release they added a new event "RowDoubleClicked" to DataGrid. How can I use this new feature and change natural behavior of DataGrid and show detail row/rows when user double clicked a row?

Answer 1

Visibility of detail row is handled by DetailRowTrigger. In the Blazorise demo for simplicity it is triggered only on selected row change, eg.

<DataGrid TItem="Employee"
    @bind-SelectedRow="@selectedEmployee"
    DetailRowTrigger="@((item)=>item.Id == selectedEmployee?.Id)">

To modify it to work with double click, you need to use DetailRowTrigger and save the selected id or item to a field so you can check for it within DetailRowTrigger handler.

<DataGrid TItem="Employee"
    RowDoubleClicked="@(e=>selectedIdOnDoubleClick = e.Item.Id)"
    DetailRowTrigger="@((item)=>item.Id == selectedEmployee?.Id)">
@code{
    private int selectedIdOnDoubleClick ;
}