From e62ab94a63e055627b54e6b39874de52bd886d6e Mon Sep 17 00:00:00 2001 From: Michael Lilli Date: Tue, 4 Mar 2014 17:36:47 -0800 Subject: [PATCH] fix(modal): respect autofocus on child elements 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 --- src/modal/modal.js | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/modal/modal.js b/src/modal/modal.js index 317f36737d..7107ea67bc 100644 --- a/src/modal/modal.js +++ b/src/modal/modal.js @@ -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) {