Angularjs Select not setted by $scope variable

Question

i have a very simple problem :

Here is my object inside my controller :

$scope.footballeur = {'identifiant':6,'prenom':'Thierry','nom':'Chalamerto','categorie':1,'ville':'Paris','age':17,'date_embauche':'','salaire':'28'};

Please notice the int variable categorie .

Now in my view, i 've got a VERY SIMPLE select like this :

<div class="input-group">
    <span class="input-group-addon stdgp"></i> Catégorie</span>
    <select  ng-init="footballeur.categorie"  ng-model="footballeur.categorie" class="form-control" >
    <option  value="1">Junior</option>
    <option value="2">Confirmé</option>
</select>
</div><br>

Then, believe me or not, but the select is unable to get setted by my value. It shows a blank line , it is really annoying.

I would really appreciate if somebody has an idea, the only thing who works is removing ng-model and replacing it by ng-value, but then, i can't save the new values chosen by the user !

I really dont know what to do, i 've tried ng-value instead of value, it still doesn't work !! I've removed ng-init, it changes nothing still ! there is not even a loop inside my SELECT , it is supposed to work directly !

here is a pic of the horrible situation :

jperelli · Accepted Answer · 2017-03-21 19:25:33Z

2

NEW ANSWER (sorry I misunderstood your question at first glance)

I think your problem has to do with "selected" attribute. Try something like this:

<option ng-selected="footballeur.categorie == 1" value="1">Junior</option>

OLD ANSWER

Make the select like this

<select ng-model="footballeur_selected" class="form-control">
  <option ng-repeat="(fname, fvalue) in footballeur" value="{{fvalue}}">{{fname}}</option>
</select>

edited Mar 21, 2017 at 19:25

answered Mar 21, 2017 at 19:20

jperelli

7,2276 gold badges54 silver badges88 bronze badges

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

1 Comment

user7370387 Over a year ago

Brilliant, your new answer works well, thank you a lot, i thought it was automatic, but obviously not !

Ben · Accepted Answer · 2017-03-21 19:21:33Z

1

Look into using ng-options to set the <select> options.

Example (HTML):

<select class='form-control' 
    ng-model="mySelectedOption"
    ng-options="myOptions">
</select>

Example (JS):

$scope.myOptions = [
    { id: "option1", name: "Option 1" },
    { id: "option2", name: "Option 2" },
    { id: "option3", name: "Option 3" }
];

answered Mar 21, 2017 at 19:21

Ben

2,7261 gold badge15 silver badges16 bronze badges

Comments

Ankit Dhanna · Accepted Answer · 2017-03-21 19:37:08Z

0

It works automatic ! ng-init does not work that way. It is simple used to evaluate an expression.

Your code works fine even without ng-init.

<select  ng-model="footballeur.categorie" class="form-control" >
<option  value="1">Junior</option>
<option value="2">Confirmé</option>
</select>

Check out the implementation here.

answered Mar 21, 2017 at 19:37

Ankit Dhanna

466 bronze badges

Collectives™ on Stack Overflow

Angularjs Select not setted by $scope variable

3 Answers 3

1 Comment

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Related