Venu
Venu

Reputation: 184

Angularjs not two way binding for select with multiple

I have a select like:

<select multiple ng-multiple="true" ng-model="selectMulti" ng-options="br.Name for br in branches"></select>

Scope objects in controller are as below:

vehicleFactory.getBranches().success(function (data) {
    $scope.branches = data;
}).error(function (data) {       
    $scope.loading = false;
});

vehicleFactory.getVehicle().success(function (data) {
    $scope.vehicle = data;
    $scope.selectMulti = $scope.vehicle.AssociatedBranches;
}).error(function (data) {       
    $scope.loading = false;
});

It is not selecting multiple items in select as it was not binding.

What is wrong in it.

Upvotes: 1

Views: 1021

Answers (1)

New Dev
New Dev

Reputation: 49590

When you use <select multiple..> the ViewModel of it is an array (unlike <select> without multiple).

So, say you have:

$scope.branches = [{...}, {...}, ...];

and the View:

<select multiple ng-model="selectMulti" ng-options="br.Name for br in branches">
</select>

Then, if you would like to select default values, your $scope.selectMulti should be an array of these values:

$scope.selectMulti = [$scope.branches[0], $scope.branches[1]];

Upvotes: 1

Related Questions