Set value to multiple <select> tags in AngularJS

Question

Im trying to set value to multiple <select> tags as shown in below picture. <select> tags are not getting selected, everything looks fine.

What im missing??

HTML:

<tr ng-repeat="t in tab track by $index">
<td>{{ $index+1 }}</td>
<td>{{ t.name }}</td>
<td>{{ t.phno }}</td>
<td>{{ t.email }}</td>
<td>{{ t.type }}</td>
<td data-ng-show="user_type=='student' || user_type=='all'">{{ t.class_name }}</td>
<td data-ng-show="user_type=='student' || user_type=='all'">{{ t.section_name }}</td>
<td data-ng-show="user_type=='student' || user_type=='all'">
    <select data-ng-show="t.type=='Student'" ng-model="plan_id">
        <option value=''>--SELECT--</option>
        <option ng-repeat="price in pricingList" data-ng-selected="{{t.plan_id == price.plan_id}}" value="{{price.plan_id}}">{{price.plan_name}}</option>
    </select>
</td>
<td data-ng-show="msg=='s'"><input type="checkbox" data-ng-model="t.selected" value="{{t.id}}" data-ng-checked="Sall"></td>
<td data-ng-show="msg=='r'">{{t.status}}</td>
<td data-ng-show="user_type=='student' || user_type=='all'">
    <button type="button" data-ng-show="t.type=='Student'" ng-click="updatePlan(plan_id, t.id);">Update</button>
</td>

JS:

    $scope.pricingList = [{"plan_id":1,"plan_name":"Free"},{"plan_id":2,"plan_name":"Basic"}];

    var URL=appURL+'/adm/loadSMSCollege.do';
    var json={"type":$scope.user_type, "class_id":$scope.class_id, "section_id":$scope.section_id, "created_by":$cookieStore.get("loginBean").created_by};
    $http.post(URL, JSON.stringify(json)).then(function(response){
        $scope.tab = response.data;
        $scope.len = response.data.length;
    });

Sample View:

Hadi · Accepted Answer · 2017-04-15 10:07:41Z

2

Try this. use ng-options instead of ng-repeat also change model to t.plan_id

 <td data-ng-show="user_type=='student' || user_type=='all'">
   <select data-ng-show="t.type=='Student'" ng-model="t.plan_id" ng-options="price.plan_id as price.plan_name for price in pricingList">
      <option value=''>--SELECT--</option>

</select>
 </td>

answered Apr 15, 2017 at 10:07

Hadi

17.3k4 gold badges41 silver badges63 bronze badges

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

1 Comment

Santosh DJ Over a year ago

works perfectly.. i will add u +1 when i get an eligibility.. thank you

Collectives™ on Stack Overflow

Set value to multiple <select> tags in AngularJS

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