Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Commit

Permalink
fix(modal): respect autofocus on child elements
Browse files Browse the repository at this point in the history
Auto-focusing of a freshly-opened modal element causes any child
elements with the autofocus attribute to loose focus. This is an issue
on touch based devices which will show and then hide the onscreen
keyboard. Attempts to refocus the autofocus element via JavaScript will
not reopen the onscreen keyboard. Fixed by updated the focusing logic to
only autofocus the modal element if the modal does not contain an
autofocus element.

Fixes #1696
Closes #1892
Closes #2273
  • Loading branch information
mlilli authored and chrisirhc committed Jul 8, 2014
1 parent 63ae06c commit e62ab94
Showing 1 changed file with 12 additions and 2 deletions.
14 changes: 12 additions & 2 deletions src/modal/modal.js
Expand Up @@ -94,8 +94,18 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.transition'])
$timeout(function () {
// trigger CSS transitions
scope.animate = true;
// focus a freshly-opened modal
element[0].focus();

/**
* Auto-focusing of a freshly-opened modal element causes any child elements
* with the autofocus attribute to loose focus. This is an issue on touch
* based devices which will show and then hide the onscreen keyboard.
* Attempts to refocus the autofocus element via JavaScript will not reopen
* the onscreen keyboard. Fixed by updated the focusing logic to only autofocus
* the modal element if the modal does not contain an autofocus element.
*/
if (!element[0].querySelectorAll('[autofocus]').length) {
element[0].focus();
}
});

scope.close = function (evt) {
Expand Down

0 comments on commit e62ab94

Please sign in to comment.