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

Commit 16d2d50

Browse files
committed
feat(typeahead): add typeaheadFocusOnSelect
- Add ability to disable focusing the input on selection
1 parent 71e0b8a commit 16d2d50

File tree

3 files changed

+32
-11
lines changed

3 files changed

+32
-11
lines changed

Diff for: src/typeahead/docs/readme.md

+5-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ The typeahead directives provide several attributes:
2727
* `typeahead-editable` <i class="glyphicon glyphicon-eye-open"></i>
2828
_(Defaults: true)_ :
2929
Should it restrict model values to the ones selected from the popup only ?
30-
30+
3131
* `typeahead-focus-first`
3232
_(Defaults: true)_ :
3333
Should the first match automatically be focused as you type?
@@ -67,3 +67,7 @@ The typeahead directives provide several attributes:
6767
* `typeahead-select-on-blur`
6868
_(Defaults: false)_ :
6969
On blur, select the currently highlighted match
70+
71+
* `typeahead-focus-on-select`
72+
_(Defaults: true) :
73+
On selection, focus the input element the typeahead directive is associated with

Diff for: src/typeahead/test/typeahead.spec.js

+24-9
Original file line numberDiff line numberDiff line change
@@ -469,54 +469,69 @@ describe('typeahead tests', function() {
469469
$timeout.flush();
470470
expect($scope.isNoResults).toBeFalsy();
471471
}));
472+
473+
it('should not focus the input if `typeahead-focus-on-select` is false', function() {
474+
var element = prepareInputEl('<div><input ng-model="result" typeahead="item for item in source | filter:$viewValue" typeahead-focus-on-select="false"></div>');
475+
var inputEl = findInput(element);
476+
477+
changeInputValueTo(element, 'b');
478+
var match = $(findMatches(element)[1]).find('a')[0];
479+
480+
$(match).click();
481+
$scope.$digest();
482+
$timeout.flush();
483+
484+
expect(document.activeElement).not.toBe(inputEl[0]);
485+
expect($scope.result).toEqual('baz');
486+
});
472487
});
473-
488+
474489
describe('select on exact match', function() {
475490
it('should select on an exact match when set', function() {
476491
$scope.onSelect = jasmine.createSpy('onSelect');
477492
var element = prepareInputEl('<div><input ng-model="result" typeahead-editable="false" typeahead-on-select="onSelect()" typeahead="item for item in source | filter:$viewValue" typeahead-select-on-exact="true"></div>');
478493
var inputEl = findInput(element);
479494

480495
changeInputValueTo(element, 'bar');
481-
496+
482497
expect($scope.result).toEqual('bar');
483498
expect(inputEl.val()).toEqual('bar');
484499
expect(element).toBeClosed();
485500
expect($scope.onSelect).toHaveBeenCalled();
486501
});
487-
502+
488503
it('should not select on an exact match by default', function() {
489504
$scope.onSelect = jasmine.createSpy('onSelect');
490505
var element = prepareInputEl('<div><input ng-model="result" typeahead-editable="false" typeahead-on-select="onSelect()" typeahead="item for item in source | filter:$viewValue"></div>');
491506
var inputEl = findInput(element);
492-
507+
493508
changeInputValueTo(element, 'bar');
494-
509+
495510
expect($scope.result).toBeUndefined();
496511
expect(inputEl.val()).toEqual('bar');
497512
expect($scope.onSelect.calls.any()).toBe(false);
498513
});
499-
514+
500515
it('should not be case sensitive when select on an exact match', function() {
501516
$scope.onSelect = jasmine.createSpy('onSelect');
502517
var element = prepareInputEl('<div><input ng-model="result" typeahead-editable="false" typeahead-on-select="onSelect()" typeahead="item for item in source | filter:$viewValue" typeahead-select-on-exact="true"></div>');
503518
var inputEl = findInput(element);
504519

505520
changeInputValueTo(element, 'BaR');
506-
521+
507522
expect($scope.result).toEqual('bar');
508523
expect(inputEl.val()).toEqual('bar');
509524
expect(element).toBeClosed();
510525
expect($scope.onSelect).toHaveBeenCalled();
511526
});
512-
527+
513528
it('should not auto select when not a match with one potential result left', function() {
514529
$scope.onSelect = jasmine.createSpy('onSelect');
515530
var element = prepareInputEl('<div><input ng-model="result" typeahead-editable="false" typeahead-on-select="onSelect()" typeahead="item for item in source | filter:$viewValue" typeahead-select-on-exact="true"></div>');
516531
var inputEl = findInput(element);
517532

518533
changeInputValueTo(element, 'fo');
519-
534+
520535
expect($scope.result).toBeUndefined();
521536
expect(inputEl.val()).toEqual('fo');
522537
expect($scope.onSelect.calls.any()).toBe(false);

Diff for: src/typeahead/typeahead.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -340,7 +340,9 @@ angular.module('ui.bootstrap.typeahead', ['ui.bootstrap.position', 'ui.bootstrap
340340

341341
//return focus to the input element if a match was selected via a mouse click event
342342
// use timeout to avoid $rootScope:inprog error
343-
$timeout(function() { element[0].focus(); }, 0, false);
343+
if (attrs.typeaheadFocusOnSelect !== false) {
344+
$timeout(function() { element[0].focus(); }, 0, false);
345+
}
344346
};
345347

346348
//bind keyboard events: arrows up(38) / down(40), enter(13) and tab(9), esc(27)

0 commit comments

Comments
 (0)