question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Radio buttons focus order - setup wizard, step 4

See original GitHub issue

Summary

Testing keyboard navigation of the Setup Wizard - in step 4 the first option Self-managed is selected by default, but there is no way to select either of the remaining two by keyboard, because after grabbing the first, the focus next jumps to the Finish button.

System information

  • Version: kolibri-0.6.dev020171007224512-git.pex
  • Operating system: Ubuntu 17.04
  • Browser: Chrome

Screenshots

unfocusabe-radio

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:14 (14 by maintainers)

github_iconTop GitHub Comments

1reaction
indirectlylitcommented, Oct 19, 2017

the focus/underline for Setup details link is correct

intentionally changed here: https://github.com/learningequality/kolibri/pull/2376

The order of options changed (“Admin-managed” first, “Self-managed” second) too, compared to the original issue, did you change that in between?

intentionally changed here: https://github.com/learningequality/kolibri/pull/2301

1reaction
jonboisercommented, Oct 9, 2017

Yes, it’s unintuitive if you’re used to tabbing through everything, but it seems like it is the correct behavior to tab into the radio button group (so the group is a single form element), but to navigate within the group, you have to use the arrow buttons (per the W3) doc. Also see https://stackoverflow.com/questions/14322564/can-you-tab-through-all-radio-buttons#14322755

Read more comments on GitHub >

github_iconTop Results From Across the Web

Likert tabbing order / selecting radio buttons.
I am trying to setup some content so it's accessible. I have found using the keyboard very hard when on a Likert scale...
Read more >
Accessibility: Radio Buttons do not Correctly Focus and Select ...
Accessibility: Radio Buttons do not Correctly Focus and Select the First Option with Backward Tab Keyboard Navigation.
Read more >
Radio Group Example Using Roving tabindex | APG | WAI - W3C
div. Identifies the div element as a container for a group of radio buttons. Is not focusable because focus is managed using a...
Read more >
Focus of some system checkboxes or radio buttons are not ...
Solved: Hi, I've got a problem while UI-programming: On my window are severel controls, some of them are system checkboxes.
Read more >
Radio button design: easy selection and decision-making
Radio buttons are typically used when the user is required to fill in a form, configure settings or complete a survey. They should...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found