Skip to content

Commit 2acaf83

Browse files
author
Ben TORFS
committed
fixes bentorfs#1 
1 parent 0be3284 commit 2acaf83

File tree

7 files changed

+154
-83
lines changed

7 files changed

+154
-83
lines changed

‎dist/angular-bootstrap-multiselect-templates.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,13 +22,13 @@ angular.module("multiselect.html", []).run(["$templateCache", function($template
2222
" class=\"divider\">\n" +
2323
" </li>\n" +
2424
"\n" +
25-
" <li role=\"presentation\" ng-repeat=\"option in selection\" class=\"active\">\n" +
25+
" <li role=\"presentation\" ng-repeat=\"option in selectedOptions\" class=\"active\">\n" +
2626
" <a class=\"item-selected\" href=\"\" ng-click=\"toggleItem(option); $event.stopPropagation()\">\n" +
2727
" <span class=\"glyphicon glyphicon-remove\"></span>\n" +
2828
" {{getDisplay(option)}}\n" +
2929
" </a>\n" +
3030
" </li>\n" +
31-
" <li ng-show=\"selection.length > 0\" class=\"divider\"></li>\n" +
31+
" <li ng-show=\"selectedOptions.length > 0\" class=\"divider\"></li>\n" +
3232
"\n" +
3333
" <li ng-show=\"showSearch\">\n" +
3434
" <div class=\"dropdown-header\">\n" +
@@ -38,7 +38,7 @@ angular.module("multiselect.html", []).run(["$templateCache", function($template
3838
" </li>\n" +
3939
"\n" +
4040
" <li ng-show=\"showSearch\" class=\"divider\"></li>\n" +
41-
" <li role=\"presentation\" ng-repeat=\"option in options | filter:search() | limitTo: searchLimit\"\n" +
41+
" <li role=\"presentation\" ng-repeat=\"option in unselectedOptions | filter:search() | limitTo: searchLimit\"\n" +
4242
" ng-if=\"!isSelected(option)\">\n" +
4343
" <a class=\"item-unselected\" href=\"\" ng-click=\"toggleItem(option); $event.stopPropagation()\">\n" +
4444
" {{getDisplay(option)}}\n" +
@@ -47,7 +47,7 @@ angular.module("multiselect.html", []).run(["$templateCache", function($template
4747
"\n" +
4848
" <li class=\"divider\" ng-show=\"selectionLimit > 1\"></li>\n" +
4949
" <li role=\"presentation\" ng-show=\"selectionLimit > 1\">\n" +
50-
" <a>{{selection.length || 0}} / {{selectionLimit}} selected</a>\n" +
50+
" <a>{{selectedOptions.length || 0}} / {{selectionLimit}} selected</a>\n" +
5151
" </li>\n" +
5252
"\n" +
5353
" </ul>\n" +

‎dist/angular-bootstrap-multiselect.js‎

Lines changed: 60 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -48,12 +48,35 @@
4848

4949
$document.on('click', closeHandler);
5050

51+
var updateSelectionLists = function () {
52+
if (!$ngModelCtrl.$viewValue) {
53+
if ($scope.selectedOptions) {
54+
$scope.selectedOptions = [];
55+
}
56+
$scope.unselectedOptions = angular.copy($scope.options);
57+
} else {
58+
$scope.selectedOptions = $scope.options.filter(function (el) {
59+
var id = $scope.getId(el);
60+
for (var i = 0; i < $ngModelCtrl.$viewValue.length; i++) {
61+
var selectedId = $scope.getId($ngModelCtrl.$viewValue[i]);
62+
if (id === selectedId) {
63+
return true;
64+
}
65+
}
66+
return false;
67+
});
68+
$scope.unselectedOptions = $scope.options.filter(function (el) {
69+
return $scope.selectedOptions.indexOf(el) < 0;
70+
});
71+
}
72+
};
73+
5174
$ngModelCtrl.$render = function () {
52-
$scope.selection = $ngModelCtrl.$viewValue;
75+
updateSelectionLists();
5376
};
5477

5578
$ngModelCtrl.$viewChangeListeners.push(function () {
56-
$scope.selection = $ngModelCtrl.$viewValue;
79+
updateSelectionLists();
5780
});
5881

5982
$ngModelCtrl.$isEmpty = function (value) {
@@ -64,8 +87,8 @@
6487
}
6588
};
6689

67-
var watcher = $scope.$watch('selection', function () {
68-
$ngModelCtrl.$setViewValue(angular.copy($scope.selection));
90+
var watcher = $scope.$watch('selectedOptions', function () {
91+
$ngModelCtrl.$setViewValue(angular.copy($scope.selectedOptions));
6992
}, true);
7093

7194
$scope.$on('$destroy', function () {
@@ -76,12 +99,12 @@
7699
});
77100

78101
$scope.getButtonText = function () {
79-
if ($scope.selection && $scope.selection.length === 1) {
80-
return $scope.getDisplay($scope.selection[0]);
102+
if ($scope.selectedOptions && $scope.selectedOptions.length === 1) {
103+
return $scope.getDisplay($scope.selectedOptions[0]);
81104
}
82-
if ($scope.selection && $scope.selection.length > 1) {
105+
if ($scope.selectedOptions && $scope.selectedOptions.length > 1) {
83106
var totalSelected;
84-
totalSelected = angular.isDefined($scope.selection) ? $scope.selection.length : 0;
107+
totalSelected = angular.isDefined($scope.selectedOptions) ? $scope.selectedOptions.length : 0;
85108
if (totalSelected === 0) {
86109
return 'Select';
87110
} else {
@@ -93,29 +116,28 @@
93116
};
94117

95118
$scope.selectAll = function () {
96-
$scope.unselectAll();
97-
angular.forEach($scope.options, function (value) {
98-
$scope.toggleItem(value);
99-
});
119+
$scope.selectedOptions = $scope.options;
120+
$scope.unselectedOptions = [];
100121
};
101122

102123
$scope.unselectAll = function () {
103-
$scope.selection = [];
124+
$scope.selectedOptions = [];
125+
$scope.unselectedOptions = $scope.options;
104126
};
105127

106128
$scope.toggleItem = function (item) {
107-
if (typeof $scope.selection === 'undefined') {
108-
$scope.selection = [];
129+
if (typeof $scope.selectedOptions === 'undefined') {
130+
$scope.selectedOptions = [];
109131
}
110-
var index = $scope.selection.indexOf(item);
111-
var exists = index !== -1;
112-
if (exists) {
113-
$scope.selection.splice(index, 1);
114-
} else if (!exists && ($scope.selectionLimit === 0 || $scope.selection.length < $scope.selectionLimit)) {
115-
if (!angular.isDefined($scope.selection) || $scope.selection == null) {
116-
$scope.selection = [];
117-
}
118-
$scope.selection.push(item);
132+
var selectedIndex = $scope.selectedOptions.indexOf(item);
133+
var currentlySelected = (selectedIndex !== -1);
134+
if (currentlySelected) {
135+
$scope.unselectedOptions.push($scope.selectedOptions[selectedIndex]);
136+
$scope.selectedOptions.splice(selectedIndex, 1);
137+
} else if (!currentlySelected && ($scope.selectionLimit === 0 || $scope.selectedOptions.length < $scope.selectionLimit)) {
138+
var unselectedIndex = $scope.unselectedOptions.indexOf(item);
139+
$scope.unselectedOptions.splice(unselectedIndex, 1);
140+
$scope.selectedOptions.push(item);
119141
}
120142
};
121143

@@ -140,13 +162,17 @@
140162
};
141163

142164
$scope.isSelected = function (item) {
143-
var result = false;
144-
angular.forEach($scope.selection, function (selectedElement) {
145-
if ($scope.getId(selectedElement) === $scope.getId(item)) {
146-
result = true;
165+
if (!$scope.selectedOptions) {
166+
return false;
167+
}
168+
var itemId = $scope.getId(item);
169+
for (var i = 0; i < $scope.selectedOptions.length; i++) {
170+
var selectedElement = $scope.selectedOptions[i];
171+
if ($scope.getId(selectedElement) === itemId) {
172+
return true;
147173
}
148-
});
149-
return result;
174+
}
175+
return false;
150176
};
151177

152178
// This search function is optimized to take into account the search limit.
@@ -199,13 +225,13 @@ angular.module("multiselect.html", []).run(["$templateCache", function($template
199225
" class=\"divider\">\n" +
200226
" </li>\n" +
201227
"\n" +
202-
" <li role=\"presentation\" ng-repeat=\"option in selection\" class=\"active\">\n" +
228+
" <li role=\"presentation\" ng-repeat=\"option in selectedOptions\" class=\"active\">\n" +
203229
" <a class=\"item-selected\" href=\"\" ng-click=\"toggleItem(option); $event.stopPropagation()\">\n" +
204230
" <span class=\"glyphicon glyphicon-remove\"></span>\n" +
205231
" {{getDisplay(option)}}\n" +
206232
" </a>\n" +
207233
" </li>\n" +
208-
" <li ng-show=\"selection.length > 0\" class=\"divider\"></li>\n" +
234+
" <li ng-show=\"selectedOptions.length > 0\" class=\"divider\"></li>\n" +
209235
"\n" +
210236
" <li ng-show=\"showSearch\">\n" +
211237
" <div class=\"dropdown-header\">\n" +
@@ -215,7 +241,7 @@ angular.module("multiselect.html", []).run(["$templateCache", function($template
215241
" </li>\n" +
216242
"\n" +
217243
" <li ng-show=\"showSearch\" class=\"divider\"></li>\n" +
218-
" <li role=\"presentation\" ng-repeat=\"option in options | filter:search() | limitTo: searchLimit\"\n" +
244+
" <li role=\"presentation\" ng-repeat=\"option in unselectedOptions | filter:search() | limitTo: searchLimit\"\n" +
219245
" ng-if=\"!isSelected(option)\">\n" +
220246
" <a class=\"item-unselected\" href=\"\" ng-click=\"toggleItem(option); $event.stopPropagation()\">\n" +
221247
" {{getDisplay(option)}}\n" +
@@ -224,7 +250,7 @@ angular.module("multiselect.html", []).run(["$templateCache", function($template
224250
"\n" +
225251
" <li class=\"divider\" ng-show=\"selectionLimit > 1\"></li>\n" +
226252
" <li role=\"presentation\" ng-show=\"selectionLimit > 1\">\n" +
227-
" <a>{{selection.length || 0}} / {{selectionLimit}} selected</a>\n" +
253+
" <a>{{selectedOptions.length || 0}} / {{selectionLimit}} selected</a>\n" +
228254
" </li>\n" +
229255
"\n" +
230256
" </ul>\n" +

0 commit comments

Comments
 (0)