AngularJS bind multiple dropdowns to one value

Question

There are 3 drop downs and all are bound to one module. Here is my fiddle

. All models are set to myOption . When one of them is selected, the value of each drop down is printed. It is ok. But the rest of drop downs' selected values become empty. I want to make other 2 drop values to Select when one drop down is selected. Any solution ?

do you mean that you want when one of the selects goes to its initial state - "Select" is selected then other two should go to that state as well ? — shershen
– shershen, Commented Feb 7, 2015 at 14:54
@shershen. Thanks for your attention. Assume the second drop down is selected and set the value to 'AAA' , then 1st and 3rd drop downs values are required to be value 'Select'. (Here the problem is, 1st and 3rd values become empty !!!) — Débora
– Débora, Commented Feb 7, 2015 at 14:58
If what me and @shershen understood is correct, then you can achieve it by having an object var obj = { label: 'Select', value: '0' }; and use it in your options like this in all options $scope.options = [ obj, {..},{..}] — CodingNinja
– CodingNinja, Commented Feb 7, 2015 at 15:01

AdirAmsalem · Accepted Answer · 2015-02-07 15:03:18Z

2

I fixed your JSFiddle here: http://jsfiddle.net/7sv0y153/4/

You shouldn't include the default empty option in your ng-options array, but have it as follows in each "select" element:

<option value="">Select</option>

This way, the "select" element will treat the option with the empty value as a default if it doesn't find a match in its ng-options.

Hope this helps.

answered Feb 7, 2015 at 15:03

AdirAmsalem

1763 bronze badges

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

Collectives™ on Stack Overflow

AngularJS bind multiple dropdowns to one value

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