[AnalyticalTable & FilterBar]: [A mechanism is unavailable to bypass blocks of content that are repeated. There is no group skipping option (shortcut key) available . Here user needs to navigate through all the UIs within the group to navigate further to next group.]

[sanjayC5373903]

Describe the bug

A mechanism is unavailable to bypass blocks of content(Raw Data in table) that are repeated on the Web page. There is no group skipping option (shortcut key) available for the group of UIs. Here user needs to navigate through all the UIs within the group to navigate further to next group.

Isolated Example

No response

Reproduction steps

1. 2. 3. ...

Expected Behaviour

It should be possible to skip every group and should be possible to jump between the groups.

Screenshots or Videos

No response

UI5 Web Components for React Version

0.27.5

UI5 Web Components Version

1.6.0

Browser

Chrome

Operating System

Windows11

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

• [X] I’m not disclosing any internal or sensitive information.

[sanjayC5373903]

Hi @Lukas742 Can you Please help me or any suggestion regarding this ticket. Thanks!

[Lukas742]

Hi @sanjayC5373903

we need more information to process this issue. Please give a detailed example of what you want to implement and explain what is missing to achieve this.

Also, if it's about the F6 Navigation feature, you can find more information about this here: https://sap.github.io/ui5-webcomponents/docs/advanced/using-features/#f6-navigation-fast-navigation

[sanjayC5373903]

Hi @Lukas742 Currently. the UI of our applications has filters at the top and a table below them. The issue we are facing is the lack of a mechanism to bypass these filters which are repeated on the webpage using keyboard. We need a skip option or a shortcut key that allows users to skip these repeated sections (e.g. filters) and move directly to the next group, which in this case is the table. For example, as shown in the previous screenshot, users need a way to quickly navigate from the filter section to the table without having to tab through each filter element.

You mentioned using the F6 navigation feature. However, I have tried that and it is not working as expected. Instead of skipping to the next section, F6 opens the address bar of the browser, as it is also a shortcut for that function in Chrome. Thank you for your assistance.

[Lukas742]

Hi @sanjayC5373903

I tried the F6 Navigation feature and it was working as intended for me. Could you please add a reproducible example of your implementation by leveraging this StackBlitz template, so we can assist you further?

[sanjayC5373903]

https://stackblitz.com/edit/github-zmyar5?file=src%2FApp.tsx,src%2FTableData.tsx,src%2FFilterFile.tsx

Hi @Lukas742 Here is the reproducible example. We need a way to quickly navigate from the filter section to the table without having to tab through each filter element. If we press F6, it opens the address bar of the browser. It should be possible to skip every group and should be possible to jump between the groups.

[Lukas742]

As described in the linked documentation, you have to first import the feature:

import "@ui5/webcomponents-base/dist/features/F6Navigation.js";

And then set data-sap-ui-fastnavgroup="true" to the element which should be focused via F6 (or Shift + F6).

Here you can find a working example.