Issues selecting multiple rows in igGrid

[benh500]

Hi

We have previously raised this issue with Infragistics support who have provided an example of how we can override the logic that drives this and manage it ourselves. They also recommended that we raise an issue here aswell.

Description

We are having issues with the selecting multiple rows within the IgGrid. I have been able to replicate this in the online designer as well.

• ignite-ui version: Ignite UI for jQuery 21.2.20212
• browser: Google Chrome

Steps to reproduce

1. open the online designer at https://designer.igniteui.com/#
2. add a grid
3. change features>selecting>multipleSelection to true
4. select some rows in the grid using shift + down arrow key
5. click on a row
6. try and select rows using shift+up key or rows starting from above the ones from step 4

Result

The issue is that some rows are not highlighted properly on step 6

Expected result

The expected rows should be selected

Attachments

bandicam.2023-01-16.10-31-19-331.mp4

Interim solution

Temporary solution to override how ignite handles row selection (doesn't solve the problem but maybe could with some changes) as provided by Infragistics support

activeRowChanged: function (evt, ui) {
        if (ui.row) {
                if (isSelected(ui.row.id)) {
                       const index = selectedRowIds.indexOf(ui.row.id);
                       selectedRowIds.splice(index, 1);
                       removeCssClass(ui.row.id);
                } else {
                       selectedRowIds.push(ui.row.id);
                       setCssClass(ui.row.id);
                }
        }
},

Also see Example html file from Infragistics support

[kdinev]

@benh500 You also need to enable the row selectors feature from the feature chooser and you can configure it to show/not show row numbering, checkboxes, etc.