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

Already on GitHub? Sign in to your account

Flipswitch widget and tab key #6955

Closed
DickvdBrink opened this Issue Jan 16, 2014 · 10 comments

Comments

Projects
None yet
3 participants
Contributor

DickvdBrink commented Jan 16, 2014

Tabbing from an input to the new flipswitch widget doesn't really work.
Tabbing to the (deprecated) slider widget does work as expected.

Example:
http://jsfiddle.net/P68fy/1/

Note: A lot of demo's have a header where they say it is using a flipswitch widget, but the deprecated slider is used instead.

Owner

arschmitz commented Jan 16, 2014

Thank you for reporting this what exactly do you mean by you cant tab to it? i can tab to the all controls in your demo though the tab order does seem to be incorrect.

Owner

arschmitz commented Jan 16, 2014

also see http://demos.jquerymobile.com/1.4.0/flipswitch/ it contains MANY flipswitchs all of which are tabbable in the correct order.

Contributor

DickvdBrink commented Jan 16, 2014

What i mean is that when I'm on the input, the first tab key moves it to the flipswitch input, instead of the flipswitch button.

Note: When you click the flipswitch button, you can move it with the left/right key but not when tabbing to (from the input)

The demo link you gave is correct, the tab key does work, but only when clicking the flipswitch the first time. After clicking all the other buttons (the view source buttons) are skipped when using the tab key.

Contributor

gabrielschulhof commented Jan 16, 2014

@arschmitz I can copy the reassign-tabindex-from-input-to-widget code from slider.

Owner

arschmitz commented Jan 16, 2014

@gabrielschulhof we should do that however i dont think thats the issue here because there is no explicitly set tabindex

Contributor

gabrielschulhof commented Jan 16, 2014

@arschmitz that doesn't mean the input is not tabbable. IINM, it is getting focus, but the focus is not being transferred to the visible parts of the widget.

Contributor

gabrielschulhof commented Jan 16, 2014

@arschmitz So the focus-transferring code still needs to be there.

Contributor

DickvdBrink commented Jan 16, 2014

Note: The flipswitch widget is setting tabindex to 1, for the button by default.
see: https://github.com/jquery/jquery-mobile/blob/master/js/widgets/forms/flipswitch.js#L93

@ghost ghost assigned gabrielschulhof Jan 16, 2014

Contributor

gabrielschulhof commented Jan 16, 2014

@DickvdBrink Yeah, it's currently hard-coded. We'll make that nicer by copying the code I referred to above to the flipswitch widget.

gabrielschulhof added a commit that referenced this issue Jan 17, 2014

Flipswitch: Transfer tabindex to "on" button and make input unfocusable
The "on" button must be an anchor for it to be focusable just like an input even
when it does not have an explicitly set tabindex. Although the input becomes
unfocusable, a focus handler that transfers focus to the "on" button is
nevertheless attached to it in case third-party code focuses the input manually.

Fixes gh-6955
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment