ngx-datatable
ngx-datatable copied to clipboard
All checkboxes in a group were checked when i check one row in group
I'm submitting a ...
[X ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter
Current behavior I have grouped data with checkboxes. When i check a checkbox in a row, all rows in the group get checked.
Expected behavior When i check one row in a group, only the checkbox of this row have to be checked
Reproduction of the problem Open https://stackblitz.com/edit/angular-ngx-table-chebox-bug. Expand a Group (female or male) and try to check a checkbox of a single row.
Our fix
In template:
<ngx-datatable ... [rowIdentity]="fixRowIdentity">
In component:
const fixedRowIdentity = (x: any) => x
What is the motivation / use case for changing the behavior? I want to select single rows with checkboxes from different groups
-
Table version: 16.0.3
-
Angular version: 8.2.14
-
Browser: Chrome Version 80.0.3987.116 (Official Build) (64-bit)
-
Language: TS 3.5.3
IMO this is caused by #1778
https://github.com/swimlane/ngx-datatable/commit/3372d63d579f3c27f8da542ce0c7b7df4b2d15c9#diff-d15e451d9c07f1930dee554115082076R771-R778
This introduced getRowExpandedIdx
which internally uses rowIdentity
. The default rowIdentity
has a context-based side-effect. It behaves differently if it's context tells, that the table is grouped. If rowIdentity
thinks the table is grouped, it treats the given row as a group object {key: ..., value: []}
. The getRowExpandedIdx
functionality uses rowIdentity
on row objects, even if the table is grouped, so rowIdentity
tries to treat a row like a group object.
Experiencing same; workaround worked for me. Thanks.
Experiencing the same with [email protected] and NG9. What's the workaround exactly? Or when this gonna be fixed?
Same issue here as well. 16.0.3
I tried the solution in my project and this not working for me because I cannot expand the groups after. It solves the problem with checkboxes, but have another one - I cannot expand the groups after. I tried the solution in the link posted of the Reproducion of the problem and it's the same error. Can you please help me? I'm new to angular, sorry if I'm doing something wrong. Please ignore the comment, the issue was from my code. Thank you
Does anyone have the workaround? @simonatocanie what was the fix you apply, I can maybe help since I have a little bit of experience with angular.
I have the same experience as @simonatocanie
with the workaround from the first post:
In template
<ngx-datatable ... [rowIdentity]="fixRowIdentity">
In component:
fixedRowIdentity = (x: any) => x
On first loading rowData shows up. On changing rowData, the groups still show up, but the rows between the groups dont
it fails to work with --prod flag in dev mode, the workaround seems ok
I tried the solution in my project and this not working for me because I cannot expand the groups after. It solves the problem with checkboxes, but have another one - I cannot expand the groups after. I tried the solution in the link posted of the Reproducion of the problem and it's the same error. Can you please help me? I'm new to angular, sorry if I'm doing something wrong. Please ignore the comment, the issue was from my code. Thank you
@simonatocanie how did you fix it? I do experience the same effect. But only when I am using --prod flag. In "dev" mode, it works fine
@ferdi4 @simonatocanie After providing const fixedRowIdentity = (x: any) => x.rowId
where rowId is a unique identifier for each row; selection issue is resolved but I am no longer able to toggleExpandGroup(group)
. Tried const fixedRowIdentity = (x: any) => x
as you mentioned but that causes all groups to collapse whenever group column is changed or data is modified. Any idea on how to make toggleExpandGroup(group)
work with this solution?
@Hypercubed Do we have update on the fix for this issue?
any fix for this?
I fixed with this rowIdentity function: fixedRowIdentity(x: any) { if(x.key) return x.key; return x.id }
this check if have "key" attribute for groups and "id" for rows