How set default value as first value in angular select option

Question

when am using this code.selected value shown as empty.i want select 1st value as one.

  <select class="form-control" name="cityID" id="Select1" ng-change="RoomSelect()" ng-model="sRoom">
                                            <option value="1" selected="selected">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                        </select>

When am using ng-model at the time default value selected as empty.otherwise its ok.

try init sRoom model in controller

Hadi
– Hadi

2017-02-28 05:29:38 +00:00
Commented Feb 28, 2017 at 5:29 — Hadi
– Hadi, Commented Feb 28, 2017 at 5:29
try setting sRoom=1 in your controller.

Karthik
– Karthik

2017-02-28 05:30:43 +00:00
Commented Feb 28, 2017 at 5:30 — Karthik
– Karthik, Commented Feb 28, 2017 at 5:30

Hadi · Accepted Answer · 2017-02-28 05:48:22Z

2

Try init sRoom model in controller

 $scope.sRoom = 1;

also its better use ng-options instead of repeat option in select tag.

Demo

var app = angular.module('anApp', []);
app.controller('aCtrl', function($scope) {
  $scope.sRoom = 1;
  
  $scope.chooses = [{"key":"one","value":1},{"key":"Two","value":2},{"key":"Three","value":3}];
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="anApp" ng-controller="aCtrl">
    <select ng-change="RoomSelect()" ng-model="sRoom" ng-options="k.value as k.key for  k in chooses">
     </select>
</div>

edited Feb 28, 2017 at 5:48

answered Feb 28, 2017 at 5:31

Hadi

17.3k4 gold badges41 silver badges63 bronze badges

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

Comments

Sujithrao · Accepted Answer · 2017-02-28 05:32:32Z

0

Try this

<select class="form-control" ng-init="sRoom=1" name="cityID" id="Select1" ng-change="RoomSelect()" ng-model="sRoom">
                                            <option value="1" selected="selected">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                        </select>

answered Feb 28, 2017 at 5:32

Sujithrao

7853 gold badges12 silver badges27 bronze badges

Comments

Sajeetharan · Accepted Answer · 2017-02-28 05:33:01Z

0

You can also use ng-init

<select class="form-control" ng-init="sRoom=1"  name="cityID" id="Select1" ng-change="RoomSelect()"

answered Feb 28, 2017 at 5:33

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Collectives™ on Stack Overflow

How set default value as first value in angular select option

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related