How to prevent row selection change

[Chris]

I need to be able to cancel row selection and there is no SelectedItemsChanging event that proceeds the SelectedItemsChanged event.  I am trying to handle it in the OnRowClick event handler, but while I can prevent other changes, the row selection change still happens.

I have a grid, and if the user clicks on a row it opens and loads a detail component below the grid.  If the detail component is visible and the user clicks in the grid on a different record I show a confirmation dialog to let them know about potentially lost changes since they have not saved.

I do this in the onrowclick handler, and if the clicked row does not equal the selected row (and the selected row is not empty then I show the confirmation after saving the selected row in a new variable

If they opt to lose the changes I proceed with the change and update the SelectedItems to the newly clicked on row.

If they opt to not proceed, then I set the SelectedItems to a new list and add the

<TelerikGrid @ref="RolesGrid"
             TItem="@GetRoles.Response"
             Pageable="true"
             Sortable="true"
             OnRead="@ReadRoles"
             EnableLoaderContainer="@IsGridLoading"
             SelectionMode="GridSelectionMode.Single"
             OnRowClick="@HandleRolesGridRowClick"
             SelectedItems="SelectedItems">

 

private async Task HandleRolesGridRowClick(GridRowClickEventArgs args)
{
var clickedRole = args.Item as GetRoles.Response;
var selectedRole = SelectedItems.FirstOrDefault();
bool allowSelection =
selectedRole == null ||
await Dialogs.ConfirmAsync($"Switching roles will lose unsaved changes in the {selectedRole.Name} role",
"Lose Unsaved Changes?");
if (allowSelection)
{
DisplayRole(clickedRole.RoleId, clickedRole.Name);
SelectedItems = new List<GetRoles.Response>(){clickedRole};
}
else
{
SelectedItems = new List<GetRoles.Response>() { selectedRole };
}
args.ShouldRender = allowSelection;

}

 

Based on another suggestion elsewhere,  I tried adding the following to the Grid's definition and and empty method to handle it and it still makes the selection change.

SelectedItemsChanged="@((IEnumerable<GetRoles.Response> selectedRecords) => HandleRoleSelection(selectedRecords))

Any help would be appreciated.

 

[Hristian Stefanov]

Hi Chris,

I'm pasting here the answer I gave you in the private ticket so the community can benefit from it.

==

As far as I understand, the main goal is to conditionally select/deselect specific rows based on logic in the OnRowClick handler.

I confirm that this is possible by using the SelectedItems list and "if" blocks. I have prepared a sample for you in this REPL link that allows selecting only the 2nd, 3rd, and 4th rows. You can copy and use the same approach to the actual project. Use the REPL sample as a comparison. I have also left comments on the code for explanation.

Additionally, here is one knowledge base article we have that gives more information about controlling the row selection with the OnRowClick event.

==

Regards,
Hristian Stefanov
Progress Telerik

[Stefan]

Please, add link to this solution to the Grid documentation. This is a very common scenario and should be readily available.

[Hristian Stefanov]

Hi Stefan,

Thank you for your suggestion.

Your feedback is highly appreciated. We will for sure explore possibilities for improving our Grid documentation.

If we can help with anything else here, I would be glad.

Kind Regards,

Hristian