diff --git a/examples/demo-groupfilter.html b/examples/demo-groupfilter.html new file mode 100644 index 000000000..edbef1d93 --- /dev/null +++ b/examples/demo-groupfilter.html @@ -0,0 +1,89 @@ + + + + + AngularJS ui-select + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Select2 theme

+

Selected: {{country.selected}}

+ + +

Filter groups by array (group-filter="['Z','B','C']")

+ + {{$select.selected.name}} + + + + + + +

Filter groups using a function (group-filter="reverseOrderFilterFn")

+ + {{$select.selected.name}} + + + + + + + + + diff --git a/examples/demo.js b/examples/demo.js index bbdc1c322..6971c888e 100644 --- a/examples/demo.js +++ b/examples/demo.js @@ -79,6 +79,14 @@ app.controller('DemoCtrl', function($scope, $http, $timeout, $interval) { }; + $scope.firstLetterGroupFn = function (item){ + return item.name[0]; + }; + + $scope.reverseOrderFilterFn = function(groups) { + return groups.reverse(); + }; + $scope.personAsync = {selected : "wladimir@email.com"}; $scope.peopleAsync = []; diff --git a/src/uiSelectChoicesDirective.js b/src/uiSelectChoicesDirective.js index 41d24e31b..69e29b6cc 100644 --- a/src/uiSelectChoicesDirective.js +++ b/src/uiSelectChoicesDirective.js @@ -21,8 +21,9 @@ uis.directive('uiSelectChoices', // var repeat = RepeatParser.parse(attrs.repeat); var groupByExp = attrs.groupBy; + var groupFilterExp = attrs.groupFilter; - $select.parseRepeatAttr(attrs.repeat, groupByExp); //Result ready at $select.parserResult + $select.parseRepeatAttr(attrs.repeat, groupByExp, groupFilterExp); //Result ready at $select.parserResult $select.disableChoiceExpression = attrs.uiDisableChoice; $select.onHighlightCallback = attrs.onHighlight; diff --git a/src/uiSelectController.js b/src/uiSelectController.js index 9fe273ac2..17f927566 100644 --- a/src/uiSelectController.js +++ b/src/uiSelectController.js @@ -59,6 +59,18 @@ uis.controller('uiSelectCtrl', } } + function _groupsFilter(groups, groupNames) { + var i, j, result = []; + for(i = 0; i < groupNames.length ;i++){ + for(j = 0; j < groups.length ;j++){ + if(groups[j].name == [groupNames[i]]){ + result.push(groups[j]); + } + } + } + return result; + } + // When the user clicks on ui-select, displays the dropdown list ctrl.activate = function(initSearchValue, avoidReset) { if (!ctrl.disabled && !ctrl.open) { @@ -90,11 +102,11 @@ uis.controller('uiSelectCtrl', })[0]; }; - ctrl.parseRepeatAttr = function(repeatAttr, groupByExp) { + ctrl.parseRepeatAttr = function(repeatAttr, groupByExp, groupFilterExp) { function updateGroups(items) { + var groupFn = $scope.$eval(groupByExp); ctrl.groups = []; angular.forEach(items, function(item) { - var groupFn = $scope.$eval(groupByExp); var groupName = angular.isFunction(groupFn) ? groupFn(item) : item[groupFn]; var group = ctrl.findGroupByName(groupName); if(group) { @@ -104,6 +116,14 @@ uis.controller('uiSelectCtrl', ctrl.groups.push({name: groupName, items: [item]}); } }); + if(groupFilterExp){ + var groupFilterFn = $scope.$eval(groupFilterExp); + if( angular.isFunction(groupFilterFn)){ + ctrl.groups = groupFilterFn(ctrl.groups); + } else if(angular.isArray(groupFilterFn)){ + ctrl.groups = _groupsFilter(ctrl.groups, groupFilterFn); + } + } ctrl.items = []; ctrl.groups.forEach(function(group) { ctrl.items = ctrl.items.concat(group.items); diff --git a/test/select.spec.js b/test/select.spec.js index d502040b4..72c0cce5e 100644 --- a/test/select.spec.js +++ b/test/select.spec.js @@ -60,6 +60,13 @@ describe('ui-select tests', function() { return person.age % 2 ? 'even' : 'odd'; }; + scope.filterInvertOrder = function(groups) { + return groups.sort(function(groupA, groupB){ + return groupA.name.toLocaleLowerCase() < groupB.name.toLocaleLowerCase(); + }); + }; + + scope.people = [ { name: 'Adam', email: 'adam@email.com', group: 'Foo', age: 12 }, { name: 'Amalie', email: 'amalie@email.com', group: 'Foo', age: 12 }, @@ -702,6 +709,46 @@ describe('ui-select tests', function() { }); }); + describe('choices group filter function', function() { + function createUiSelect() { + return compileTemplate('\ + \ + {{$select.selected.name}} \ + \ +
\ +
\ +
' + ); + } + it("should sort groups using filter", function () { + var el = createUiSelect(); + expect(el.find('.ui-select-choices-group .ui-select-choices-group-label').map(function() { + return this.textContent; + }).toArray()).toEqual(["Foo", "Baz", "bar"]); + }); + }); + + describe('choices group filter array', function() { + function createUiSelect() { + return compileTemplate('\ + \ + {{$select.selected.name}} \ + \ +
\ +
\ +
' + ); + } + it("should sort groups using filter", function () { + var el = createUiSelect(); + expect(el.find('.ui-select-choices-group .ui-select-choices-group-label').map(function() { + return this.textContent; + }).toArray()).toEqual(["Foo"]); + }); + }); + + it('should throw when no ui-select-choices found', function() { expect(function() { compileTemplate(