From cf3332d6d1ba2846b3fd1d2897353bf049be4c8c Mon Sep 17 00:00:00 2001 From: Wesley Cho Date: Fri, 7 Aug 2015 23:52:47 -0700 Subject: [PATCH] feat(datepicker): add `onOpenFocus` support - Add `onOpenFocus` attribute for optional disabling of focus of popup after datepicker popup is opened --- src/datepicker/datepicker.js | 10 +++++++--- src/datepicker/docs/readme.md | 5 +++++ src/datepicker/test/datepicker.spec.js | 25 +++++++++++++++++++++++++ 3 files changed, 37 insertions(+), 3 deletions(-) diff --git a/src/datepicker/datepicker.js b/src/datepicker/datepicker.js index 5bdb8f7451..41cb0a08b2 100644 --- a/src/datepicker/datepicker.js +++ b/src/datepicker/datepicker.js @@ -487,7 +487,8 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst closeText: 'Done', closeOnDateSelection: true, appendToBody: false, - showButtonBar: true + showButtonBar: true, + onOpenFocus: true }) .directive('datepickerPopup', ['$compile', '$parse', '$document', '$rootScope', '$position', 'dateFilter', 'dateParser', 'datepickerPopupConfig', '$timeout', @@ -506,7 +507,8 @@ function ($compile, $parse, $document, $rootScope, $position, dateFilter, datePa link: function(scope, element, attrs, ngModel) { var dateFormat, closeOnDateSelection = angular.isDefined(attrs.closeOnDateSelection) ? scope.$parent.$eval(attrs.closeOnDateSelection) : datepickerPopupConfig.closeOnDateSelection, - appendToBody = angular.isDefined(attrs.datepickerAppendToBody) ? scope.$parent.$eval(attrs.datepickerAppendToBody) : datepickerPopupConfig.appendToBody; + appendToBody = angular.isDefined(attrs.datepickerAppendToBody) ? scope.$parent.$eval(attrs.datepickerAppendToBody) : datepickerPopupConfig.appendToBody, + onOpenFocus = angular.isDefined(attrs.onOpenFocus) ? scope.$parent.$eval(attrs.onOpenFocus) : datepickerPopupConfig.onOpenFocus; scope.showButtonBar = angular.isDefined(attrs.showButtonBar) ? scope.$parent.$eval(attrs.showButtonBar) : datepickerPopupConfig.showButtonBar; @@ -727,7 +729,9 @@ function ($compile, $parse, $document, $rootScope, $position, dateFilter, datePa scope.position.top = scope.position.top + element.prop('offsetHeight'); $timeout(function() { - scope.$broadcast('datepicker.focus'); + if (onOpenFocus) { + scope.$broadcast('datepicker.focus'); + } $document.bind('click', documentClickBind); }, 0, false); } else { diff --git a/src/datepicker/docs/readme.md b/src/datepicker/docs/readme.md index 0311b0596f..78f0a29228 100644 --- a/src/datepicker/docs/readme.md +++ b/src/datepicker/docs/readme.md @@ -118,10 +118,15 @@ Specific settings for the `datepicker-popup`, that can globally configured throu * `datepicker-append-to-body` _(Default: false)_: Append the datepicker popup element to `body`, rather than inserting after `datepicker-popup`. For global configuration, use `datepickerPopupConfig.appendToBody`. + * `is-open` _(Default: false)_: Whether to show the datepicker. + * `on-open-focus` + _(Default: true)_: + Whether to focus the datepicker popup upon opening. + ### Keyboard Support ### Depending on datepicker's current mode, the date may reffer either to day, month or year. Accordingly, the term view reffers either to a month, year or year range. diff --git a/src/datepicker/test/datepicker.spec.js b/src/datepicker/test/datepicker.spec.js index c0342a8710..18659c41fc 100644 --- a/src/datepicker/test/datepicker.spec.js +++ b/src/datepicker/test/datepicker.spec.js @@ -2104,6 +2104,31 @@ describe('datepicker directive', function () { expect(getTitle()).toBe('November 1980'); }); }); + + describe('attribute `onOpenFocus`', function() { + beforeEach(function() { + $rootScope.date = null; + $rootScope.isopen = false; + var wrapElement = $compile('
')($rootScope); + $rootScope.$digest(); + assignElements(wrapElement); + }); + + it('should remain focused on the input', function() { + var focused = true; + expect(dropdownEl.length).toBe(0); + + inputEl[0].focus(); + inputEl.on('blur', function() { + focused = false; + }); + $rootScope.isopen = true; + $rootScope.$digest(); + + expect(inputEl.parent().find('.dropdown-menu').length).toBe(1); + expect(focused).toBe(true); + }); + }); }); describe('with empty initial state', function () {