How to check for deselected rows while using multi row selection?

[Nick]

I have managed to get multi row selection working and I am trying to get the ID of the row as shown in the attached example. So far, I can get the selected rows working fine but if a user de-selects a row, it isn't being counted as getting de-selected. Is there a method I can use to trigger the de-selection? 

I would prefer not to use Grid.ClearSelectionAsync(); as I want to proceed with the remaining selected rows excluding the deselected rows.

Attachment: TestSample_4c2ab401.zip

[Vignesh Natarajan]

Hi Nick,

Thanks for contacting Syncfusion support.

Query: “I would prefer not to use Grid.ClearSelectionAsync(); as I want to proceed with the remaining selected rows excluding the deselected rows.”

We can get the details of the selected record using the GetSelectedRecordsAsync method of Grid. From your code example, we found that you have used the GetSelectedRecordAsync method inside the RowSelected event of Grid. This grid event will not be triggered when a row is deselected in Grid. Hence the SelectedValue variable remains the same when a row is deselected.

We have a RowDeselected event to trigger when the record is deselected. We suggest you handle the similar operation in that event to achieve your requirement. Refer to the below code example.

<div id="target">

    <SfGrid @ref="OrderGrid" DataSource="@Orders" AllowFiltering="true" AllowPaging="true" AllowSorting="true" AllowResizing="true"

            EnableHover="true" AllowSelection="true">

        <GridFilterSettings Type="Syncfusion.Blazor.Grids.FilterType.CheckBox"></GridFilterSettings>

        <GridPageSettings PageSize="15"></GridPageSettings>

        <GridSelectionSettings Type="Syncfusion.Blazor.Grids.SelectionType.Multiple" Mode="Syncfusion.Blazor.Grids.SelectionMode.Row"></GridSelectionSettings>

        <GridEvents RowSelected="SelectHandler" RowDeselected="DeselectHandler" TValue="Order"></GridEvents>

. . . . . .

    </SfGrid>

</div>

 

@code{

    public List<Order> Orders { get; set; }

    public List<Customer> Customers { get; set; }

 

    private SfGrid<Order> OrderGrid { get; set; }

 

    public List<Order> SelectedRows { get; set; }

    public Order[] SelectedRowsArray { get; set; }

    public List<string> SelectedValue = new List<string>();

 

. . . . .. .

 

    public async Task DeselectHandler(RowDeselectEventArgs<Order> args)

    {

        await GetSelectedRecords();

    }

    public async Task SelectHandler(RowSelectEventArgs<Order> args)

    {

        await GetSelectedRecords();

    }

 

    public async Task GetSelectedRecords()

    {

        SelectedRows = await this.OrderGrid.GetSelectedRecordsAsync();

        SelectedRowsArray = SelectedRows.ToArray();

         SelectedValue.Clear();

        foreach (var data in SelectedRowsArray)

        {

          

            SelectedValue.Add(data.OrderID.ToString());

        }

        SelectedValue = SelectedValue.Distinct().ToList();

 

        Debug.WriteLine("**********************");

        foreach (var value in SelectedValue)

        {

            Debug.WriteLine("OrderID: " + value);

        }

        Debug.WriteLine("**********************");

 

        StateHasChanged();

    }

}

Please find the modified sample in the attachments.

https://blazor.syncfusion.com/documentation/datagrid/events#rowdeselected

Please get back to us if you have further queries.

Regards,

Vignesh Natarajan

Attachment: TestSample_b19e66d0.zip