cant fetch value of dropdown in angularjs

Question

I have a drop down select menu and i want to store the selected value in the controller.i.e If office1 is selected then Office! is selected in the scope and so. I am unable to store the value in the controller as I am new to angularjs.Can somebody Help Heres my dropdown code

    <div class="col-xs-12">
<h5>Select the System:</h5>

   <select id="repeatSystem" ng-model="selectedSystem" style="width: 100%">
    <option ng-repeat="(key,value) in systems" value="{{key}}">{{key}}</option>
</select>

 <select id="repeatOffice" ng-model="selectedState" style="width: 100%">
    <option ng-repeat="system in systems[selectedSystem]" value="state">{{system}}</option>
</select>

</div>

here is the plunker link http://plnkr.co/edit/nNsM4VMVeHXS2hDIsAAd?p=preview

It matters when you want to get value in controller??

Manwal
– Manwal

2015-10-14 10:10:09 +00:00
Commented Oct 14, 2015 at 10:10 — Manwal
– Manwal, Commented Oct 14, 2015 at 10:10

Manwal · Accepted Answer · 2015-10-14 10:37:53Z

3

Because you are binding select dropdown with ng-model then you can simply access these value in your controller.

This will give you first dropdown selected value

$scope.selectedSystem //same in view {{selectedSystem}}

This is for second

$scope.selectedState //same in view {{selectedState}}

DEMO select value and check.

Updates

I have updated this following line, where you had hardcoded value="state" to i changed it to value="{{state}}":

<option ng-repeat="state in result[selectedArea]" value="{{state}}">{{state}}</option>

See Updated DEMO

edited Oct 14, 2015 at 10:37

answered Oct 14, 2015 at 10:08

Manwal

23.9k15 gold badges65 silver badges95 bronze badges

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

4 Comments

Dola Over a year ago

I also want to add that he should change the value="state" to value="{{state}}" or tong-value="state"

Manwal Over a year ago

I don't understand what you want to do explain it more.

Dola Over a year ago

In the second select with id="repeatOffice", all options would have the value which is "state" rather than the actual value for each state. and I don't think that's what the OP wants. To get the actual value of the selected item, value="state" should be changed to value="{{state}}" or to ng-value="state"

Manwal Over a year ago

@Dola got this point updated answer and added information. I believe this is what OP want.

Samuel · Accepted Answer · 2015-10-14 10:11:51Z

1

I'm a bit confused about how to answer the question. The value of the drop-downs in the controller will be bound to the variables:

$scope.selectedArea and $scope.selectedState depending on what values are selected in the view. The value attribute that you're setting is overriding it however.

I've updated your plunkr here: http://plnkr.co/edit/F2KqqtWKvPndv7y6un1F?p=preview

I've also demonstrated setting initial values in your dropdowns that will remove that annoying "blank" option.

answered Oct 14, 2015 at 10:11

Samuel

2,4522 gold badges23 silver badges43 bronze badges

Comments

Prakash Bisht · Accepted Answer · 2015-10-28 06:18:26Z

1

You can get the answer from this link http://forum.ionicframework.com/t/get-selected-value-from-a-select/20241

answered Oct 28, 2015 at 6:18

Prakash Bisht

2261 silver badge10 bronze badges

Collectives™ on Stack Overflow

cant fetch value of dropdown in angularjs

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related