Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Columns are sorted when space key is down during typing in filters #3535

Closed
Kosssma opened this issue Jun 24, 2024 · 3 comments · May be fixed by #3574
Closed

Columns are sorted when space key is down during typing in filters #3535

Kosssma opened this issue Jun 24, 2024 · 3 comments · May be fixed by #3574
Labels

Comments

@Kosssma
Copy link

Kosssma commented Jun 24, 2024

Describe the bug

When user type key word in filter when he hit space instead of space char as next sign he trigger column sorting functionality. User can not enter space from keyboard, he can only paste it into filter to be able to use it.

To Reproduce

  1. Create a header with a filter like the the [Header filters](example https://adazzle.github.io/react-data-grid/#/header-filters)
  2. Enable sorting like in the [Columns reordering[(example https://adazzle.github.io/react-data-grid/#/columns-reordering)

Link to code example:

Expected behavior

when typing in filter sign user hit space this should not trigger column sorting

Environment

  • react-data-grid version: ^7.0.0-beta.44
  • react/react-dom version: ^18.2.0

Additional context

code line responsible for effect:

onKeyDown={sortable ? onKeyDown : undefined}

if (event.key === ' ' || event.key === 'Enter') {

@Kosssma Kosssma added the Bug label Jun 24, 2024
@ronneldavis
Copy link

This seems to be related to this issue as well: #3439

@holaChaitanya
Copy link

image

why not try something like - stop event propagation inside the renderHeaderCell itself?

@amanmahajan7
Copy link
Contributor

The above recommended approach (using stopPropagation) is the right way to resolve this issue
https://github.com/adazzle/react-data-grid/blob/main/website/routes/HeaderFilters.lazy.tsx#L72-L82

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
4 participants