diff --git a/src/uiSelectDirective.js b/src/uiSelectDirective.js
index 8fad7e386..3d391825c 100644
--- a/src/uiSelectDirective.js
+++ b/src/uiSelectDirective.js
@@ -44,6 +44,9 @@ uis.directive('uiSelect',
$select.onSelectCallback = $parse(attrs.onSelect);
$select.onRemoveCallback = $parse(attrs.onRemove);
+ //Limit the number of selections allowed
+ $select.limit = (angular.isDefined(attrs.limit)) ? parseInt(attrs.limit, 10) : undefined;
+
//Set reference to ngModel from uiSelectCtrl
$select.ngModel = ngModel;
diff --git a/src/uiSelectMultipleDirective.js b/src/uiSelectMultipleDirective.js
index b1e997ec5..48a2480f9 100644
--- a/src/uiSelectMultipleDirective.js
+++ b/src/uiSelectMultipleDirective.js
@@ -155,6 +155,9 @@ uis.directive('uiSelectMultiple', ['uiSelectMinErr','$timeout', function(uiSelec
};
scope.$on('uis:select', function (event, item) {
+ if($select.selected.length >= $select.limit) {
+ return;
+ }
$select.selected.push(item);
$selectMultiple.updateModel();
});
diff --git a/test/select.spec.js b/test/select.spec.js
index 5f58b5f97..80f953c46 100644
--- a/test/select.spec.js
+++ b/test/select.spec.js
@@ -1754,34 +1754,67 @@ describe('ui-select tests', function() {
});
- it('should watch changes for $select.selected and update formatted value correctly', function () {
+ it('should watch changes for $select.selected and update formatted value correctly', function () {
- scope.selection.selectedMultiple = ['wladimir@email.com', 'samantha@email.com'];
+ scope.selection.selectedMultiple = ['wladimir@email.com', 'samantha@email.com'];
- var el = compileTemplate(
- ' \
- {{$item.name}} <{{$item.email}}> \
- \
- \
- \
- \
- \
- '
- );
+ var el = compileTemplate(
+ ' \
+ {{$item.name}} <{{$item.email}}> \
+ \
+ \
+ \
+ \
+ \
+ '
+ );
- var el2 = compileTemplate('');
+ var el2 = compileTemplate('');
- expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
- .toBe("Wladimir Samantha ");
+ expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
+ .toBe("Wladimir Samantha ");
- clickItem(el, 'Nicole');
+ clickItem(el, 'Nicole');
- expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
- .toBe("Wladimir Samantha Nicole ");
+ expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
+ .toBe("Wladimir Samantha Nicole ");
- expect(scope.selection.selectedMultiple.length).toBe(3);
+ expect(scope.selection.selectedMultiple.length).toBe(3);
- });
+ });
+
+ it('should ensure the multiple selection limit is respected', function () {
+
+ scope.selection.selectedMultiple = ['wladimir@email.com'];
+
+ var el = compileTemplate(
+ ' \
+ {{$item.name}} <{{$item.email}}> \
+ \
+ \
+ \
+ \
+ \
+ '
+ );
+
+ var el2 = compileTemplate('');
+
+ expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
+ .toBe("Wladimir ");
+
+ clickItem(el, 'Samantha');
+ expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
+ .toBe("Wladimir Samantha ");
+
+ clickItem(el, 'Nicole');
+
+ expect(el.find('.ui-select-match-item [uis-transclude-append]:not(.ng-hide)').text())
+ .toBe("Wladimir Samantha ");
+
+ expect(scope.selection.selectedMultiple.length).toBe(2);
+
+ });
it('should change viewvalue only once when updating modelvalue', function () {