Filter angular dropdown function depending of what you select previously

Question

I am trying to filter an ng-options dropdown depending of what you select in the previous one. This is what I am trying to achieve

If you choose Internal Tier 1 then show all company tiers

If you choose Internal Tier 2 show all except 1 - Partner Branded

If you choose Internal Tier 3 show only 3b- Answer Branded

This is my actual code.

 $scope.companyData = {
            Category: 0,
            InternalTierId: 0
        };

$scope.lookUps = {
companyTier: [
    { Id: 1, Name: '1 - Partner Branded'},
    { Id: 2, Name: '2 - Co-branded'},
    { Id: 3, Name: '3a - Answer Branded'},
    { Id: 4, Name: '3b - Answer Branded'}
],
internalTier: [
    { Id: 1, Name: 'Tier 1' },
    { Id: 2, Name: 'Tier 2' },
    { Id: 3, Name: 'Tier 3' }
]};

And these are the dropdowns. I cannot change the ng-model since I am using that object properties.

<select class="form-control" name="companyinternaltier" 
ng-required="true" ng-model="companyData.InternalTierId" 
ng-options="item.Id as item.Name for item in lookUps.internalTier">          
<option value="">- Select Internal Tier Level -</option>

<select class="form-control" name="companytier" ng-required="true" 
ng-model="companyData.Category" ng-options="item.Id as item.Name for
item in lookUps.companyTier | filter: filterTiers()"> 
<option value="">- Select Branding Tier Level -</option></select>

I put filterTiers() function after the filter word because I think I could create a function to do that but I dont know how to handle it

I appreciate any kind of help. Thanks

What is the actual relation between two drop-down,,,and please make a plunkr. — Mohaimin Moin
– Mohaimin Moin, Commented Mar 14, 2016 at 5:03
The relation is that If you choose Tier 1 then show all company tiers If you choose Tier 2 show all except 1 - Partner Branded If you choose Tier 3 show only 3b- Answer Branded — Gilberto Quintero
– Gilberto Quintero, Commented Mar 14, 2016 at 5:08

Mohaimin Moin · Accepted Answer · 2016-03-14 06:03:48Z

1

You can use ng-change option.See in the Plunker

answered Mar 14, 2016 at 6:03

Mohaimin Moin

8411 gold badge11 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Gilberto Quintero Over a year ago

Thank you so much, this is exactly what I was looking for.

Collectives™ on Stack Overflow

Filter angular dropdown function depending of what you select previously

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related