primefaces / primefaces/primereact
DataTable: Filter component disappear when a new row is generated
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
If you have a DataTable that is being filled in-real-time, you have filters for the columns and with scrollable mode, if you are in the middle of the scroll and you open a filter, when a new data enters the DataTable, the filter option disappear.
It register that new element as a user's scroll.
This might make it difficult for clients to search values on in-real-time DataTables.
Reproducer
https://stackblitz.com/edit/react-bfqahr-ho6jls?file=src/App.js
PrimeReact version
9.2.2
React version
18.x
Language
TypeScript
Build / Runtime
Create React App (CRA)
Browser(s)
Chrome
Steps to reproduce the behavior
- Create a DataTable that has a new value from time to time. It has to be scrollable and have a filter.
- Scroll down a little bit. Just enough to ensure you are not at the beginning of the table.
- Open a filter.
- Wait until a new value arrives the table.
- The filter should have disappeared.
Expected behavior
Maybe, the filter should not disappear or an option for the filter be present in order to prevent this if the developer wants.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the StackBlitz reproducer at src/App.js and inspect the DataTable behavior for scrollable tables with column filters. Reproduce the issue by opening a filter while scrolled, then adding a row. Done means the filter remains available when a new row arrives, with regression coverage added if the relevant test location can be identified.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100