grid row selection and deselection

[Hash Line]

I am using blazor grid to display list of ages. I need to update the table with the values when the row is selected and remove the value from table when row is deselected. But right now rowdeselected handler is called even if i select another row as existing row is getting deselected. Is there a ways to call deselected only when that specific row is clicked again.

[Prathap Senthil]

Hi Hash Line,

Greetings from Syncfusion,

Query:”right now rowdeselected handler is called even if i select another row as existing row is getting deselected. Is there a ways to call deselected only when that specific row is clicked again.”


Based on your query, we suggest the following approach to achieve your requirement. Here, we have used checkboxes to select multiple rows. If you want to deselect a specific row, simply uncheck that row, and only the specific row will be deselected. You can achieve your goal this way. Kindly refer to the code snippet and sample below for your reference

SfGrid DataSource="@Orders" AllowSelection="true" AllowPaging="true">

    <GridSelectionSettings Type="Syncfusion.Blazor.Grids.SelectionType.Multiple" CheckboxOnly="true"></GridSelectionSettings>

 

    <GridEvents RowSelected="RowSelectHandler" RowDeselected="RowDeselectHandler" TValue="Order"></GridEvents>

    <GridColumns>

        <GridColumn Type="ColumnType.CheckBox" Width="50"></GridColumn>

        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Right" Width="120"></GridColumn>

        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>

        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="Syncfusion.Blazor.Grids.ColumnType.Date" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Right" Width="130"></GridColumn>

        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Right" Width="120"></GridColumn>

    </GridColumns>

</SfGrid>

Sample:https://blazorplayground.syncfusion.com/embed/rDrzMDhWyqPHiauH?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Reference:https://blazor.syncfusion.com/documentation/datagrid/selection

Regards,
Prathap Senthil