<div class="col-xs-5 pull-left"> <div class="form-group"> <label class="control-label">{{unassignedItemsTitle}}</label> <div> <select class="select-list" multiple ng-model="unassigned" name="unAssignedList" data-no-dirty-check ng-options="unassignedItem.descrip for unassignedItem in unassignedItems | orderBy:'descrip' | filter: filterCriteria"></select> </div> </div> </div>Please note the filter here.
<div class="form-group"> <div class="col-md-3"> <label title="@Labels.department" class="control-label">@Labels.department:</label> </div> <div class="col-md-6 col-lg-6"> <select class="form-control" ng-model="selectedDeptId" no-dirty-check ng-options="d.departmeId as d.descrip for d in metaData.allDepartments"> <option value="">@String.Format(Labels.selectX, Labels.department)</option> </select> </div> </div> <div class="form-group"> <div class="col-md-3"> <label title="@Labels.category" class="control-label">@Labels.category:</label> </div> <div class="col-md-6 col-lg-6"> <select class="form-control" ng-model="selectedCategoryId" ng-disabled="!selectedDeptId" no-dirty-check ng-options="c.categoryId as c.descrip for c in metaData.allCategories |filter:{departmeId:selectedDeptId}"> <option value="">@String.Format(Labels.selectX, Labels.category)</option> </select> </div> </div> <div class="form-group padd"> <data-sm:duallist-directive ng-required="false" keep-pristine="true" unassigned-items-title="'@String.Format(Labels.availableX, Labels.items)'" unassigned-items="currentBenefit.unassignedItems" assigned-items-title="'@String.Format(Labels.assignedX, Labels.items)'" assigned-items="currentBenefit.assignedItems" sortable="false" filter-criteria="{categoryId:selectedCategoryId}" selected-item="currentBenefit.selectedItem"> </data-sm:duallist-directive> </div>The code for the directive is: (only relevant code shown here)
restrict: 'E', templateUrl: 'app/templates/smDuallist', require: ['^form'], scope: { assignedItems: '=assignedItems', unassignedItems: '=unassignedItems', assignedItemsTitle: '=', unassignedItemsTitle: '=', filterCriteria: '=', sortable: '=sortable', selectedItem: '=?', keepPristine: '=?' }, link: function (scope, element, attrs, ctrls) { scope.form = ctrls[0]; if (!scope.keepPristine) scope.keepPristine = false; }Now the strange thing - the filter works correctly in 99%. But for some strange reason it doesn't work when I select department Tickets and category 'Adult Tickets'. It shows more items with the categoryId not matching the selected category Id. (Although it doesn't seem to show all items, only some of them, but definitely more than for that particular category)