diff --git a/examples/bootstrap.html b/examples/bootstrap.html index a1e362b46..051db596f 100644 --- a/examples/bootstrap.html +++ b/examples/bootstrap.html @@ -42,20 +42,35 @@
ui-select inside a Bootstrap form -
- -
+
+ +
+ + + {{$select.selected.name}} + +
+ +
+
+ +
+
- - {{$select.selected.name}} - -
- -
-
+
+ +
+ + {{$select.selected.name}} + +
+ +
+
+ +
-
diff --git a/src/bootstrap/match.tpl.html b/src/bootstrap/match.tpl.html index a76c9b862..ec1bb47f5 100644 --- a/src/bootstrap/match.tpl.html +++ b/src/bootstrap/match.tpl.html @@ -1,4 +1,4 @@ -
+
+ ng-show="$select.open">
diff --git a/src/uiSelectController.js b/src/uiSelectController.js index ba3e6d56d..11d428b28 100644 --- a/src/uiSelectController.js +++ b/src/uiSelectController.js @@ -113,6 +113,9 @@ uis.controller('uiSelectCtrl', $scope.$broadcast('uis:activate'); ctrl.open = true; + if(!ctrl.searchEnabled) { + angular.element(ctrl.searchInput[0]).addClass('ui-select-offscreen'); + } ctrl.activeIndex = ctrl.activeIndex >= ctrl.items.length ? 0 : ctrl.activeIndex; @@ -141,6 +144,10 @@ uis.controller('uiSelectCtrl', }); } } + else if (ctrl.open && !ctrl.searchEnabled) { + // Close the selection if we don't have search enabled, and we click on the select again + ctrl.close(); + } }; ctrl.focusSearchInput = function (initSearchValue) { @@ -390,6 +397,9 @@ uis.controller('uiSelectCtrl', if (ctrl.ngModel && ctrl.ngModel.$setTouched) ctrl.ngModel.$setTouched(); _resetSearchInput(); ctrl.open = false; + if(!ctrl.searchEnabled) { + angular.element(ctrl.searchInput[0]).removeClass('ui-select-offscreen'); + } $scope.$broadcast('uis:close', skipFocusser); diff --git a/test/select.spec.js b/test/select.spec.js index 063b9fb66..0669cbb22 100644 --- a/test/select.spec.js +++ b/test/select.spec.js @@ -1557,13 +1557,13 @@ describe('ui-select tests', function() { it('should show search input when true', function() { setupSelectComponent('true', 'bootstrap'); clickMatch(el); - expect($(el).find('.ui-select-search')).not.toHaveClass('ng-hide'); + expect($(el).find('.ui-select-search')).not.toHaveClass('ui-select-offscreen'); }); it('should hide search input when false', function() { setupSelectComponent('false', 'bootstrap'); clickMatch(el); - expect($(el).find('.ui-select-search')).toHaveClass('ng-hide'); + expect($(el).find('.ui-select-search')).toHaveClass('ui-select-offscreen'); }); });