Select box default value with ng-model set to first value

Question

I have a select box with options being generated like this:

<select ng-model="module.sectionID">
  <option ng-repeat="section in sections" value="{{section.$id}}">
     {{section.title}}
  </option>
</select>

As you can see the value of the option is arbitrary, so I can't set the default value like this:

ng-init="module.sectionID='this value will change'"

I want the default value to be the first option in the select box, right now it is always a null / blank value, until they make a selection, which isn't very user friendly.

it would be module.sectionID = sessions[0].$id

Pankaj Parkar
– Pankaj Parkar

2015-11-29 18:55:35 +00:00
Commented Nov 29, 2015 at 18:55 — Pankaj Parkar
– Pankaj Parkar, Commented Nov 29, 2015 at 18:55
Do I put that on the ng-model or ng-init?

Jordash
– Jordash

2015-11-29 20:24:49 +00:00
Commented Nov 29, 2015 at 20:24 — Jordash
– Jordash, Commented Nov 29, 2015 at 20:24

FrailWords · Accepted Answer · 2015-11-29 20:11:29Z

1

   <select ng-model="module.sectionID" ng-init="module.sectionID=sections[0].$id" ng-options="section.$id as section.title for section in sections">
   </select>

edited Nov 29, 2015 at 20:11

answered Nov 29, 2015 at 19:12

FrailWords

9262 gold badges8 silver badges21 bronze badges

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

6 Comments

Jordash Over a year ago

That's an ok solution, but I don't want it to say -- choose section -- I want it to select the 1st valid option by default, so that there is always a valid choice made no matter what.

FrailWords Over a year ago

You can remove that 'option' tag and the 'init' would select the first option. I have edited my answer.

Jordash Over a year ago

I tried that, and it reverts back to being blank by default

Jordash Over a year ago

I'm doing it exactly the same way and it's still not working, I wonder if it's because I'm pulling data from firebase

Jordash Over a year ago

Actually I see it flash the correct value for a little bit and then it reverts back to blank, the ng-init value get's wiped out.

|

Collectives™ on Stack Overflow

Select box default value with ng-model set to first value

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related