search

IgniteUI / ignite-ui

Ignite UI for jQuery by Infragistics
https://bit.ly/2kuu1fT
Other
477 stars 84 forks source link

Issues selecting multiple rows in igGrid #2219

Open benh500 opened 1 year ago

benh500 commented 1 year ago

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.

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

Video of problem being replicated

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 commented 1 year ago

@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.

image