Skip to content

Column chooser list cannot be navigated in column menu #4652

Open
@zstoyanova9

Description

@zstoyanova9

Description

When the column chooser is used within the column menu of the Grid, the column list cannot be navigated as expected. The column list does not receive focus when tabbing out of the "Columns" item, but instead, the "Apply" button gets focused.
The column list can only receive focus by using the Arrow keys after the "Apply" button has been focused.

This behavior starts reproducing as of v19.0.0 of the components.
Example with v18.5.2 - https://stackblitz.com/edit/angular-h81qby6z

Steps To Reproduce

  1. Open the following StackBlitz example - https://stackblitz.com/edit/angular-mack5j9i
  2. Open the column menu of a random column.
  3. Use the Tab key to navigate through the items.
  4. Use Enter to collapse the "Columns" item.
  5. Try to enter the column list with the Tab key.

Screenshots or video

Screen.Recording.2025-06-20.at.11.05.12.mov

Actual Behavior

The column list does not receive focus after exiting the "Columns" item when using the Tab key. Instead, the "Apply" button gets focused, and only then, the column list can be focused, but with the Arrow keys.

Expected Behavior

The column list should receive focus after tabbing out of the "Columns" item.

Last working version of the Kendo UI for Angular package (if regression).

18.5.2

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions