How to get checkboxes to populate based on selected option in angular?

Question

   <select class="form-control" ng-model="filterFormInputs.apps"
     ng-options="app.Application for app in d">
     <option value="" disabled selected>Select an Application</option
 </select>

I have the above code snippet somewhere in my index.html. And in my corresponding controller I have $scope.d = [{"Application": "app1", "details":[{"name":"name1"},{"name":"name2"},{"name":"name3"}]}, {"Application":"app2", "details":[{"name":"name4"},{"name":"name5"},{"name":"name6"}]}]

How do i make it such that when I select "app1" from the select form, I can populate a list of checkboxes with the corresponding "name" field" ? For example, if I select app1, I want three checkboxes with name1, name2, and name3 to appear. And if I select app2 from the select form, I want three checkboxes with app4, app5, and app6 to appear? using ng-repeat / ng-model

dfsq · Accepted Answer · 2015-07-08 13:25:43Z

3

You need one more ngRepeat. For example like this:

<select class="form-control" ng-model="filterFormInputs.apps" ng-options="app.Application for app in d">
    <option value="" disabled selected>Select an Application</option> 
</select>

<label ng-repeat="checkbox in filterFormInputs.apps.details">
    <input type="checkbox" ng-model="checkbox.checked"> {{checkbox.name}}
</label>

You just need to decide to what model bind those checkboxes.

Demo: http://plnkr.co/edit/u9Bk7L9jLAxKzMbMjLmu?p=preview

answered Jul 8, 2015 at 13:25

dfsq

193k26 gold badges244 silver badges261 bronze badges

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

Collectives™ on Stack Overflow

How to get checkboxes to populate based on selected option in angular?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related