jbetancur / react-data-table-component

A responsive table library with built-in sorting, pagination, selection, expandable rows, and customizable styling.
https://react-data-table-component.netlify.app
Apache License 2.0
2.04k stars 411 forks source link

It's not possible to control the selected rows + filter the rows at the same time #1114

Closed GuYounes closed 1 year ago

GuYounes commented 2 years ago

Issue Check list

Describe the bug

If i want to control the selected rows with the selectableRowSelected and onSelectedRowsChange properties and at the same time filter the data given to the table, it will result by a loss of the selected rows which are no longer displayed due to the filtering.

To Reproduce

Steps to reproduce the behavior:

  1. Go to codesandbox
  2. Select all the users in the table
  3. Filter the table with the input in the header. Look for "Richard" per exemple
  4. You can see now only 1 row is selected. If you remove the filter in the input to show all the rows, you will see as well that there is only the row displayed by the filter which is still selected

Expected behavior

Keep the rows selected even if we filter

Code Sandbox, Screenshots, or Relevant Code

https://codesandbox.io/s/react-data-table-component-typescript-forked-noudn4?file=/src/index.tsx

Versions (please complete the following information)

GuYounes commented 1 year ago

@jbetancur any news on this ? Can I contribute to this maybe ?

rockyWal commented 1 year ago

@GuYounes Do you have any solution for this? I'm also having the same issue. If you have solution please post it. Thanks.