library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Datepicker: Improve tab order handling

Browse Source 
Remove unneeded tabindex attribute change. Set focus to input after tab,
let default behavior decide which elements gains focus next.
This commit is contained in:
Felix Nagel 2015-12-03 16:39:30 +01:00
parent 1f92856d29
commit 14392056e1
1 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
ui/widgets/datepicker.js
View File

@ -193,12 +193,24 @@ var widget = $.widget( "ui.datepicker", {
clearTimeout( this.closeTimer ); clearTimeout( this.closeTimer );
}, },
// TODO on TAB (or shift TAB), make sure it ends up on something useful in DOM order keydown: function( event ) {
keyup: function( event ) {
if ( event.keyCode === $.ui.keyCode.ESCAPE && this.calendar.is( ":visible" ) ) { if ( event.keyCode === $.ui.keyCode.ESCAPE && this.calendar.is( ":visible" ) ) {
this.close( event ); this.close( event );
this._focusTrigger(); this._focusTrigger();
} }
if ( event.keyCode === $.ui.keyCode.TAB && this.calendar.is( ":visible" ) ) {
var element = $( event.target );
// Reset focus when leaving widget
if (
( event.shiftKey && element.is( this.calendarInstance.prevButton ) ) ||
( !event.shiftKey && element.is( this.calendarInstance.grid.last() ) )
) {
this.close( event );
this._focusTrigger();
}
}
} }
}, },
@ -262,11 +274,7 @@ var widget = $.widget( "ui.datepicker", {
.hide(); .hide();
this._show( this.calendar, this.options.show ); this._show( this.calendar, this.options.show );
// Take trigger out of tab order to allow shift-tab to skip trigger
// TODO Does this really make sense? related bug: tab-shift moves focus to last element on page
this.element.attr( "tabindex", -1 );
this.isOpen = true; this.isOpen = true;
this._trigger( "open", event ); this._trigger( "open", event );
}, },
@ -274,8 +282,6 @@ var widget = $.widget( "ui.datepicker", {
this._setHiddenPicker(); this._setHiddenPicker();
this._hide( this.calendar, this.options.hide ); this._hide( this.calendar, this.options.hide );
this.element.attr( "tabindex", 0 );
this.isOpen = false; this.isOpen = false;
this._trigger( "close", event ); this._trigger( "close", event );
}, },