Primeng: Table checkbox selection ignores filtering

Created on 26 Feb 2018  路  15Comments  路  Source: primefaces/primeng

**I'm submitting a ...

[x ] bug report

Current behavior
If you use table selection (https://www.primefaces.org/primeng/#/table/selection) and have a checkbox header to select all (p-tableHeaderCheckbox), selecting all will include filtered out rows and rows from other pages.

Expected behavior

When you select all, it shouldn't include in the selected data array, data that has been filtered out or is on another page. It should only select what's visible on the screen.

Minimal reproduction of the problem with instructions

Create a table with two pages of data and a basic filter and multi row selection with checkboxes as per the docs. Note that when you select all, items you have filtered out or are on another page are included in the selection.

What is the motivation / use case for changing the behavior?

It's the logical expected behaviour, only to select what you can see.

  • Angular version: 5.2.6

  • PrimeNG version: 5.2.0

  • Browser: all

  • Language: [all]

defect

Most helpful comment

+1

All 15 comments

+1

Having the exact same issue.
Is there a temporary fix that can be implemented with table selection?

You would have to keep track of the current filters selected with onFilter()then manually remove them from the array set with [(selection)]=

I'm having a similar issue. When I check the p-tableHeaderCheckbox I get all on page (in my case 20) and next i nav through pages I can select one off items and it adds to my total number of selected items. However as soon as I check the select all on page again it blows away my selected items and shows me only those 20. Same thing if i select all on page 1, go to page 2 and select all again...page 1 stuff is gone.

Same behavioral issues here ... totally confusing feature if it does not work fully integrated with paging and filters.

Anyone confirmed this in 5.2.4? The select all checkbox is now not responding for me.

it's fixed in 5.2.4

after filtering and select all with checkbox you cannot deselect all with the checkbox again
that issue appear in the version 5.2.4

In 5.2.4 the behavior appears to be different depending on if [headerCheckboxToggleAllPages] is "true" or "false". If true then the bug is still there and the check-all checkbox ignores filtering. If false, then the check-all checkbox appears to work correctly (clearing previously selected options and selecting all currently filtered options).

However, I am using the deprecated datatable: https://www.primefaces.org/primeng/#/datatable/selection

What should be the behaviour for the following situation :

  1. Select 4 rows
  2. Filter to display only 2 of the 4 rows selected
  3. => the 2 hidden rows should remain selected or not ?

the 2 hidden rows not selected

@chfiras p-table keep the selection, no matter what is filtered

What should be the behaviour for the following situation :
Select 4 rows
Filter to display only 2 of the 4 rows selected
=> the 2 hidden rows should remain selected or not ?

In that case the 4 rows should remain selected as you took no extra action.

  1. Select All rows (4)
  2. Filter to display only two rows (both of which are still selected, including the two you can no longer see)
  3. Deselect all rows (0 now selected)
  4. Select all rows while filtering is still applied (2 rows selected)
  5. Clear filtering - all rows now shown (2 rows still selected)

you took no extra action

So the p-table doesn't actually maintain the selection if applied AFTER select all is selected, only before.
To do this, we must keep track when 'select all' checkbox is applied, then deselect all, then select all programatically when the filter changes with via onFilter, or put the onus on the user.

Select all now works and respects filtering if used after filter, however I there is now a second (expected) feature for filtering to respect select all.

There is also another bug associated here. Check box is disabled, following a select all on a filtered collection.

  • Apply Filter
  • Select All
  • Not the select All checkbox is disabled.

I handled it using this.dataSource.filteredData instead of this.dataSource.data.
https://stackblitz.com/edit/angular-biuy85

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Helayxa picture Helayxa  路  3Comments

jisqaqov picture jisqaqov  路  3Comments

garethlewis picture garethlewis  路  3Comments

markgoho picture markgoho  路  3Comments

philly-vanilly picture philly-vanilly  路  3Comments