bootstrap
bootstrap copied to clipboard
Allow programatically re-opening Typeahead dropdown
Bug description:
We're trying to re-open the dropdown on input focus but there are only two paths that might have worked: typeahead-is-open
and assignIsOpen({ isOpen: true })
.
Neither works because uib internally checks scope.choices.length
right after resetting the matches array, meaning the isOpen
method always returns false.
Fixing this could also allow a user-controlled solution to #6046.
Link to minimally-working plunker that reproduces the issue:
http://plnkr.co/edit/XRjoYZO0BZuOWXaMlGgy?p=preview
Version of Angular, UIBS, and Bootstrap
Angular 1.5.8, uib 2.0.2, bootstrap 3.x
I would like to open the typead if there is already an option selected
Possible solution -> create own directive like so;
app.directive('typeaheadAsSelect', [function() {
return {
restrict: 'A',
require: ['ngModel'],
link: function($scope, $element, attrs, ctrls){
$element.bind('focus', function(){
$scope.prevValue = ctrls[0].$viewValue;
ctrls[0].$setViewValue("");
});
$element.bind('blur', function(){
setTimeout(function(){
if(!ctrls[0].$viewValue && $scope.prevValue) {
ctrls[0].$setViewValue($scope.prevValue);
ctrls[0].$render();
}
}, 150);
});
}
}
}]);
Usage:
<input uib-typeahead="..." typeahead-as-select />
Found similar issue on this stackoverflow thread. The solution that is working for me is simply adding typeahead-min-length attribute like so:
<input type="text" typeahead-min-length="0" uib-typeahead="t for t in timeZoneList">
The solution referenced by 1993Dajana does not address this problem (opening the dropdown when input receives focus even after it contains a value.). The provided plunker already sets typeahead-min-length="0".