fix(autocomplete): md-min-length now supports 0 as a value and will…

… show dropdown on focus
angular · Apr 2, 2015 · dcf9268 · dcf9268
1 parent 01e90c0
commit dcf9268
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 16 deletions.
diff --git a/src/components/autocomplete/js/autocompleteController.js b/src/components/autocomplete/js/autocompleteController.js
@@ -33,6 +33,7 @@
 
     self.keydown  = keydown;
     self.blur     = blur;
+    self.focus    = focus;
     self.clear    = clearValue;
     self.select   = select;
     self.fetch    = $mdUtil.debounce(fetchResults);
@@ -125,33 +126,27 @@
       if ($scope.textChange && searchText !== previousSearchText)
         $scope.textChange(getItemScope($scope.selectedItem));
       //-- cancel results if search text is not long enough
-      if (!searchText || searchText.length < Math.max(parseInt($scope.minLength, 10), 1)) {
+      if (!isMinLengthMet()) {
         self.loading = false;
         self.matches = [];
         self.hidden = shouldHide();
         updateMessages();
-        return;
-      }
-      var term = searchText.toLowerCase();
-      //-- cancel promise if a promise is in progress
-      if (promise && promise.cancel) {
-        promise.cancel();
-        promise = null;
-      }
-      //-- if results are cached, pull in cached results
-      if (!$scope.noCache && cache[term]) {
-        self.matches = cache[term];
-        updateMessages();
       } else {
-        fetchResults(searchText);
+        handleQuery();
       }
-      self.hidden = shouldHide();
     }
 
     function blur () {
       if (!noBlur) self.hidden = true;
     }
 
+    function focus () {
+      //-- if searchText is null, let's force it to be a string
+      if (!angular.isString($scope.searchText)) return $scope.searchText = '';
+      self.hidden = shouldHide();
+      if (!self.hidden) handleQuery();
+    }
+
     function keydown (event) {
       switch (event.keyCode) {
         case $mdConstant.KEY_CODE.DOWN_ARROW:
@@ -186,6 +181,10 @@
 
     //-- getters
 
+    function getMinLength () {
+      return angular.isNumber($scope.minLength) ? $scope.minLength : 1;
+    }
+
     function getDisplayValue (item) {
       return (item && $scope.itemText) ? $scope.itemText(getItemScope(item)) : item;
     }
@@ -202,6 +201,7 @@
     }
 
     function shouldHide () {
+      if (!isMinLengthMet()) return true;
       return self.matches.length === 1
           && $scope.searchText === getDisplayValue(self.matches[0])
           && $scope.selectedItem === self.matches[0];
@@ -211,6 +211,10 @@
       return getDisplayValue(self.matches[self.index]);
     }
 
+    function isMinLengthMet () {
+      return $scope.searchText.length >= getMinLength();
+    }
+
     //-- actions
 
     function select (index) {
@@ -275,5 +279,23 @@
       }
     }
 
+    function handleQuery () {
+      var searchText = $scope.searchText,
+          term = searchText.toLowerCase();
+      //-- cancel promise if a promise is in progress
+      if (promise && promise.cancel) {
+        promise.cancel();
+        promise = null;
+      }
+      //-- if results are cached, pull in cached results
+      if (!$scope.noCache && cache[term]) {
+        self.matches = cache[term];
+        updateMessages();
+      } else {
+        fetchResults(searchText);
+      }
+      self.hidden = shouldHide();
+    }
+
   }
 })();
diff --git a/src/components/autocomplete/js/autocompleteDirective.js b/src/components/autocomplete/js/autocompleteDirective.js
@@ -75,6 +75,7 @@
                   ng-model="$mdAutocompleteCtrl.scope.searchText"\
                   ng-keydown="$mdAutocompleteCtrl.keydown($event)"\
                   ng-blur="$mdAutocompleteCtrl.blur()"\
+                  ng-focus="$mdAutocompleteCtrl.focus()"\
                   aria-owns="ul-{{$mdAutocompleteCtrl.id}}"\
                   aria-label="{{floatingLabel}}"\
                   aria-autocomplete="list"\
@@ -92,6 +93,7 @@
                 ng-model="$mdAutocompleteCtrl.scope.searchText"\
                 ng-keydown="$mdAutocompleteCtrl.keydown($event)"\
                 ng-blur="$mdAutocompleteCtrl.blur()"\
+                ng-focus="$mdAutocompleteCtrl.focus()"\
                 placeholder="{{placeholder}}"\
                 aria-owns="ul-{{$mdAutocompleteCtrl.id}}"\
                 aria-label="{{placeholder}}"\
@@ -116,7 +118,7 @@
                 ng-mouseup="$mdAutocompleteCtrl.mouseUp()">\
               <li ng-repeat="(index, item) in $mdAutocompleteCtrl.matches"\
                   ng-class="{ selected: index === $mdAutocompleteCtrl.index }"\
-                  ng-show="$mdAutocompleteCtrl.scope.searchText && !$mdAutocompleteCtrl.hidden"\
+                  ng-hide="$mdAutocompleteCtrl.hidden"\
                   ng-click="$mdAutocompleteCtrl.select(index)"\
                   md-autocomplete-list-item-template="contents"\
                   md-autocomplete-list-item="$mdAutocompleteCtrl.itemName">\