2

When i tab (via tabulator) through the elements of my page, im jumping on each single sort-by-column element in the table header (which by click sorts the datatable e.g. asc/desc by the column).

Is there any way to prevent this? I dont want to jump on the sort-elements inside the header, when i press tab.

for testing -> http://www.primefaces.org:8080/showcase/ui/data/datatable/sort.xhtml?jfwid=96c2f

just press tab and you will jump through the headers.

I need this for a page where the user tabs through all input elements - for workflow optimization. Jumping through all the sort-elements of all tables on this page is a big time waster.

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
config
  • 136
  • 1
  • 10

1 Answers1

3

Sortable table headers are focusable for a reason: accessibility. This is important and in some cases and countries even required. Not something you want to throw out of the window.

If you want to optimize the user experience, why not set the focus to the first field the user is supposed to deal with? PrimeFaces offers a validation aware Focus component which can help you with this task. That's the route I would take.

See also:

If you really, really want to disable focussing of sortable table headers, you could use a bit of JavaScript to set the tabindex of the sortable headers to -1 to prevent them from being focusable:

$("th.ui-sortable-column").attr("tabindex", "-1");

But, again, I would go for the focus option.

See also:

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102