CODEWITHSUNDEEP
angularjsangularjs-directive
Sanjeev
Sanjeev

Reputation: 135

Change dropdown selected value on click in angularjs

I have created a dropdown using angularjs directive. Following is the template I have used

<select ng-model="selected" ui-select2="{allowClear: true, placeholder: placeholder}">' +
            '<option value=""></option>' +
              '<optgroup ng-repeat="group in Groups" label="{{group.name}}">' +
                '<option ng-repeat="value in values" value="{{value.code}}" >{{value.name}}</option>' +
              '</optgroup>' +
          '</select>

Now, I have a table which has same dropdown values in one of the columns. When a table row is clicked I need to get the value and select the respective value in the dropdown automatically. I was able to fetch values from the row but not sure how to select the clicked option in the dropdown. I have searched around for suggestions but got nothing so far. Please suggest. I have started learning angularjs last week only so pardon me if I am missing something obvious here.

Upvotes: 3

Views: 5521

Answers (1)

Arbus
Arbus

Reputation: 304

The general solution what you are trying to accomplish is to simply change the model of the select element and select boxes' value will update automatically.

Assuming that your table row is set up like so:

<table><tbody>
    <tr ng-repeat="number in [1,2,3,4]">
         <td><button ng-click="selected = number">{{number}}</button></td>
    </tr>
</tbody></table>

<select ng-model="selected">
    <option ng-repeat="value in [1,2,3,4]" value="{{value}}">{{value}}</option>
</select>

clicking on the button in the table will set the value of the select dropdown accordingly

Upvotes: 2

Related Questions