Faredoon
Faredoon

Reputation: 339

Angularjs - select/options - set default selection after applying filter

Please take a look at this plunkr.

I have a couple of select lists that are filtered based on some simple conditions. There is a list (of Plants) that is dynamically constructed by clicking on the "Add" button. When each row is added, I would like the selects to automatically select the first item in the list. Please bear in mind that there are filters and the items change based on the select list on the top of the form (SalesOrg).

Preferably, I would like to do this without using DOM in the controller.

UPDATE: Have a look at this simpler plunk. Select "Texas" as the state. The city dropdown has been accordingly filtered. The initial selection does not work because the original dropdown variable (DropDownData.Cities) is no longer the source of the select - it has been filtered.

Upvotes: 1

Views: 2778

Answers (1)

Maxim Shoustin
Maxim Shoustin

Reputation: 77910

Just useng-init like:

<select class="form-control"  id="selSalesOrg" ng-model="SelData.SalesOrg"
    data-ng-options="salesOrg.id as salesOrg.Description for salesOrg in DropDownData.SalesOrgs"
    ng-init="SelData.SalesOrg = DropDownData.SalesOrgs[0].id">
    </select>

The fixed PLunker

The second way is instead ng-init directive add to your controller something like:

$scope.SelData.SalesOrg = DropDownData.SalesOrgs[0].id; 

Comment**

Since you use filter actually we can't take first element but first in list after filtering

Upvotes: 1

Related Questions