Cannot set option value in select programmatically using AngularJs

Question

The select:

select(ng-model="elId", ng-change="load(elId)", ng-options="e._id as e.name for e in options")
    option(value="") - select a mashup -

Controller:

The following works, the select gets populated. I am using broadcasts because it comes from a socket.. don't mind that.

 //receive list
 $scope.$on('list:refresh', function(ev, data) {
     $scope.options = data
 })

The following only works if I did not manually select any option before. data.id is a valid entry in the list.

 //refresh list of mashups when a new one has been created
 $scope.$on('list:select', function (ev, data) {  
     $scope.elId = data.id
 })

If I manually select an option, and then the list:select fires, the $scope.elId is udated but the <select> does not highlight the option.

What is going on?

Your issue appears to be the fact that you're not utilizing the ng-selected directive. Check out the docs here — jnthnjns
– jnthnjns, Commented Aug 23, 2013 at 16:21
that cold be a problem, too.. but not in this case, see my answer :) thanks though — fusio
– fusio, Commented Aug 23, 2013 at 16:36

fusio · Accepted Answer · 2013-08-23 16:35:48Z

1

Solved:

The select:

select(ng-model="data.elId", ng-change="load()", ng-options="e._id as e.name for e in options")
    option(value="") - select a mashup -

Controller:

 //receive list
 $scope.$on('list:refresh', function(ev, data) {
     $scope.options = data
 })

 $scope.load() {
    var elId = $scope.data.elId
    ....
 }

 //refresh list of mashups when a new one has been created
 $scope.$on('list:select', function (ev, data) {  
     $scope.data.elId = data.id
 })

I guess the problem was that I tried to change the selected value from a child controller.. now I am using a service Data that I load into the controllers $scope.data = Data.. meh?

answered Aug 23, 2013 at 16:35

fusio

3,6756 gold badges35 silver badges52 bronze badges

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

3 Comments

BoxerBucks Over a year ago

I think what solved the issue is you changing the ng-model from a simple variable to the property of an object. This seems like a common problem with ng-model in angular. I have fought it a few times.

fusio Over a year ago

Oh, I see - gotta remember that! :) Just lost few hours for that problem :P

BoxerBucks Over a year ago

I know, me too. That has to be high on the list of Angular gotchas.

Collectives™ on Stack Overflow

Cannot set option value in select programmatically using AngularJs

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related