diff --git a/examples/demo-in-form.html b/examples/demo-in-form.html new file mode 100644 index 000000000..9637f0159 --- /dev/null +++ b/examples/demo-in-form.html @@ -0,0 +1,105 @@ + + +
+ +Enter any field a press Enter Key. It will submit form when dropdown list is closed
+ + + + + \ No newline at end of file diff --git a/src/uiSelectController.js b/src/uiSelectController.js index 1afccb72e..151ce4356 100644 --- a/src/uiSelectController.js +++ b/src/uiSelectController.js @@ -427,7 +427,7 @@ uis.controller('uiSelectCtrl', case KEY.ENTER: if(ctrl.open && (ctrl.tagging.isActivated || ctrl.activeIndex >= 0)){ ctrl.select(ctrl.items[ctrl.activeIndex]); // Make sure at least one dropdown item is highlighted before adding if not in tagging mode - } else { + } else if (!$scope.inForm) { ctrl.activate(false, true); //In case its the search input in 'multiple' mode } break; @@ -450,6 +450,10 @@ uis.controller('uiSelectCtrl', // ctrl.close(); // } + if ($scope.inForm && key === KEY.ENTER && !ctrl.open) { + return; // allow submit in parent form + } + $scope.$apply(function() { var tagged = false; diff --git a/src/uiSelectDirective.js b/src/uiSelectDirective.js index ed3394d01..3fd3a620f 100644 --- a/src/uiSelectDirective.js +++ b/src/uiSelectDirective.js @@ -50,6 +50,9 @@ uis.directive('uiSelect', //Limit the number of selections allowed $select.limit = (angular.isDefined(attrs.limit)) ? parseInt(attrs.limit, 10) : undefined; + //Do not open dropdown list and do not stop propagation to allow form submit if pressing Enter (only if dropdown list is closed) + scope.inForm = (angular.isDefined(attrs.inForm)) ? $parse(attrs.inForm)(scope) : true; + //Set reference to ngModel from uiSelectCtrl $select.ngModel = ngModel; diff --git a/src/uiSelectSingleDirective.js b/src/uiSelectSingleDirective.js index bad98a7ed..2489df8fb 100644 --- a/src/uiSelectSingleDirective.js +++ b/src/uiSelectSingleDirective.js @@ -93,7 +93,7 @@ uis.directive('uiSelectSingle', ['$timeout','$compile', function($timeout, $comp return; } - if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC) { + if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC || (scope.inForm && e.which == KEY.ENTER)) { return; }