Skip to content
Permalink
Browse files

Dialog: If a show animation is provided, the post-show code dependent…

… on the dialog being ready occur in a callback function passed to the show method. Fixed #4421, 4675 - Focus lost from dialog which uses show effect.
  • Loading branch information...
ajcrews committed Jun 24, 2010
1 parent e4e5c29 commit 1d1de7fc70501c25c6ff3de204c04078602baa04
Showing with 49 additions and 38 deletions.
  1. +49 −38 ui/jquery.ui.dialog.js
@@ -282,50 +282,61 @@ $.widget("ui.dialog", {
}
self._size();
self._position(options.position);
uiDialog.show(options.show);
self.moveToTop(true);

// prevent tabbing out of modal dialogs
if (options.modal) {
uiDialog.bind('keypress.ui-dialog', function(event) {
if (event.keyCode !== $.ui.keyCode.TAB) {
return;
}

// Handle show animation
var fShowCallback = function(event) {
self.moveToTop(true);

var tabbables = $(':tabbable', this),
first = tabbables.filter(':first'),
last = tabbables.filter(':last');
// prevent tabbing out of modal dialogs
if (options.modal) {
uiDialog.bind('keypress.ui-dialog', function(event) {
if (event.keyCode !== $.ui.keyCode.TAB) {
return;
}

var tabbables = $(':tabbable', this),
first = tabbables.filter(':first'),
last = tabbables.filter(':last');

if (event.target === last[0] && !event.shiftKey) {
first.focus(1);
return false;
} else if (event.target === first[0] && event.shiftKey) {
last.focus(1);
return false;
}
});
}

if (event.target === last[0] && !event.shiftKey) {
first.focus(1);
return false;
} else if (event.target === first[0] && event.shiftKey) {
last.focus(1);
return false;
}
});
}

// set focus to the first tabbable element in the content area or the first button
// if there are no tabbable elements, set focus on the dialog itself
if (!options.focusSelector) {
var arrTab = [],
$tab;
// set focus to the first tabbable element in the content area or the first button
// if there are no tabbable elements, set focus on the dialog itself
if (!options.focusSelector) {
var arrTab = [],
$tab;

arrTab.push(uiDialog.find('.ui-dialog-content :tabbable:not(' + options.focusFilter + '):first').filter(':not(.close)'));
arrTab.push(uiDialog.find('.ui-dialog-buttonpane :tabbable:first'));
arrTab.push(uiDialog);

arrTab.push(uiDialog.find('.ui-dialog-content :tabbable:not(' + options.focusFilter + '):first').filter(':not(.close)'));
arrTab.push(uiDialog.find('.ui-dialog-buttonpane :tabbable:first'));
arrTab.push(uiDialog);

// Focus first populated selection
for (var i = 0; i < arrTab.length; i++) {
$tab = arrTab[i];
if ($tab.length) {
$tab.focus();
break;
// Focus first populated selection
for (var i = 0; i < arrTab.length; i++) {
$tab = arrTab[i];
if ($tab.length) {
$tab.focus();
break;
}
}
} else {
uiDialog.find(options.focusSelector).focus();
}
};

if (options.show) {
uiDialog.show(options.show, fShowCallback);
} else {
uiDialog.find(options.focusSelector).focus();
uiDialog.show();

fShowCallback();
}

self._trigger('open');

2 comments on commit 1d1de7f

@ajcrews

This comment has been minimized.

Copy link
Owner Author

replied Jun 24, 2010

This commit bundles fixes for:

http://dev.jqueryui.com/ticket/5767
http://dev.jqueryui.com/ticket/4675
http://dev.jqueryui.com/ticket/4421
http://dev.jqueryui.com/ticket/4731

Dialog: If a show animation is provided, the post-show code dependent on the dialog being ready occur in a callback function passed to the show method. Fixed #4421, 4675 - Focus lost from dialog which uses show effect.

Dialog: Added "focusSelector" option which will be used to focus the desired element when the dialog is opened. Fixed #4731 - Add option to set which element gains focus on open.

Dialog: Selecting the first tabbable element using a native Array instead of the jQuery "add" method, which always returns in document order as of jQuery 1.4. Also added "focusFilter" option, so one could prevent something like a tabbable close button from being focused. Fixed #5767 - On open, the first tabbable element inside the dialog was never being focused in favor of the dialog container.

@ajcrews

This comment has been minimized.

Copy link
Owner Author

replied Jun 24, 2010

Please sign in to comment.
You can’t perform that action at this time.