How to set default value for select in angularjs

Question

I have this:

  <select class=" text-center form-control" name="custname"
            ng-model="a.custid" 
            ng-init="devcustname[0].customer_name"
            ng-change="fetchassocd(a)">

     <option value="" selected="true">Please select a Customer name</option>
     <option ng-repeat="a in devcustname | orderBy:['customer_name']"
            value="{{a.customer_id}}">{{a.customer_name}}
    </option>
  </select>

I want the default value to be devcustname[0].customer_name. The ng-init is not working. When the devcustname[0].customer_name is null or undefined I want the "Please select a Customer name" to be displayed as default.

If I use ng-options I can't show the "Please select a Customer name"".

ng-init="devcustname[0].customer_name || a.custid = ''" and <option value="">Please select a Customer name</option> — Slava Utesinov
– Slava Utesinov, Commented Jun 9, 2018 at 6:52
@SlavaUtesinov ng-init just doesn't work even when there are values. — Nobody
– Nobody, Commented Jun 9, 2018 at 6:55

Slava Utesinov · Accepted Answer · 2018-06-09 07:30:31Z

1

angular.module('app', []).controller('ctrl', function($scope){
   $scope.devcustname = [
    {customer_id: "3", customer_name: '', customer_email: "[email protected]", contact_no: "23", address_line1: "6, f4"},
    {customer_id: "4", customer_name: "ab", customer_email: "sm", contact_no: "12", address_line1: "R V Road, 10th cross"},
    {customer_id: "5", customer_name: "da", customer_email: "[email protected]", contact_no: "33", address_line1: "6, f4"}
  ];   
  $scope.a = {custid: "4"};
})

<script src="//code.angularjs.org/snapshot/angular.min.js"></script>

<div ng-app='app' ng-controller='ctrl'>
  <select class="text-center form-control" name="custname" ng-model="a.custid" ng-init="temp = devcustname[0].customer_name || (a = {custid:''})" ng-change="fetchassocd(a)">
    <option value="" ng-disabled="isDisabled">
    	-Please select a Customer name-
    </option>
    <option ng-repeat="a in devcustname | orderBy : 'customer_name'" value="{{a.customer_id}}">
      {{a.customer_name}}
    </option>
 </select>  
</div>

edited Jun 9, 2018 at 7:30

answered Jun 9, 2018 at 7:04

Slava Utesinov

13.5k2 gold badges21 silver badges26 bronze badges

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

2 Comments

Slava Utesinov Over a year ago

@Nobody, is my answer provides proper/desired behavior?

Slava Utesinov Over a year ago

@Nobody, I reproduced your plunker at my answer.

Collectives™ on Stack Overflow

How to set default value for select in angularjs

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related