How to assign default value in Dropdownboxlist?

Question

Hi I am developing angularjs application. I tried many ways to set default value for dropdown in Angularjs but I am not able to set default value.

 <select ng-change="getModel(b.ID)" ng-model="b.ID"  id="brand" ng-options="b.MakeName for b in list">
                    <option value="1">-- Select a Make --</option>//Not working
                </select>
                <select  ng-change="getStyle(a.ID)" ng-model="a.ID" ng-options="a.ModelName for a in Modellist" id="make" >
                    <option value="1">-- Select a Model --</option>
                </select>//Not working
                <select ng-change="getallDetails(c.ID)" id="type" ng-model="c.ID" ng-options="c.BodyStayleName for c in ModelStyle">
                    <option value="1">-- Select a Type --</option>
                </select>//Not working

May I know am i missing here anything? Any help would be appreciated. Thank you.

Possible duplicate of [how to use ng-option to set default value of select element](http://stackoverflow.com/questions/17329495/how-to-use-ng-option-to-set-default-value-of-select-element) — Castro Roy, Apr 17 '17 at 14:19
Have you google for it? I've just found a big list of other SO questions/answers than can help you with your issue [Why does AngularJS include an empty option in select?](http://stackoverflow.com/questions/12654631/why-does-angularjs-include-an-empty-option-in-select) [ng-options how to set first select always blank](http://stackoverflow.com/questions/19182961/ng-options-how-to-set-first-select-always-blank) [How to have a default option in Angular.js select box](http://stackoverflow.com/questions/18194255/how-to-have-a-default-option-in-angular-js-select-box) — Castro Roy, Apr 17 '17 at 14:22

Sajeetharan · Accepted Answer · 2017-04-17T19:49:12.087

1

Use ng-init or set the default value to the model variable inside the controller,

  $scope.BrandId = "1";

DEMO

<!DOCTYPE html>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
  <script>
    angular.module("myapp", [])
      .controller("MyController", function($scope) {
        $scope.register = {};
        $scope.BrandId = "1";

        $scope.brands = [{
          id: "1",
          name: "TOYOTA"
        }, {
          id: "2",
          name: "HONDA"
        }, {
          id: "3",
          name: "MARUTI"
        }, {
          id: "4",
          name: "BMW"
        }];
      });
  </script>
</head>

<body ng-app="myapp">
  <div ng-controller="MyController">
    <div>
      <select ng-init="BrandId=='1'" ng-model="BrandId" ng-options="brand.id as brand.name for brand in brands"></select>
    </div>
  </div>
</body>

</html>

edited Apr 17 '17 at 19:49

answered Apr 17 '17 at 13:38

Sajeetharan

216,225
63
350
396

Thank you. I added but still i am facing issue. Please refere the ss. – Niranjan Godbole Apr 17 '17 at 13:44
what do you have inside list[0] – Sajeetharan Apr 17 '17 at 13:45
@NiranjanGodbole Since its an object, you need to access the ID property ng-init="b.ID = list[0].ID" – Sajeetharan Apr 17 '17 at 13:47
Yes i understood and i tried with ID and MakeName but no luck. In browser i am getting – Niranjan Godbole Apr 17 '17 at 13:55
Thank you. On page load it is giving one bank row as shown above in image. But after selecting one value it is working fine as expected. – Niranjan Godbole Apr 18 '17 at 05:12
@NiranjanGodbole just check if the value is being set – Sajeetharan Apr 18 '17 at 05:20
and so on it is rendering in html. – Niranjan Godbole Apr 18 '17 at 05:21
Select i added and started working fine. Is this is the correct way? – Niranjan Godbole Apr 18 '17 at 05:27
no this wont work. you need to add the select to the brands – Sajeetharan Apr 18 '17 at 05:29
I added in all dropdowns. it is working. Is there any disadvantage if i use this approach? – Niranjan Godbole Apr 18 '17 at 05:33
No , what do you mean by disadvantage? – Sajeetharan Apr 18 '17 at 05:33
i mean do i face any problem in ng-change or selecting values from dropdown? – Niranjan Godbole Apr 18 '17 at 05:34
No there wont be any – Sajeetharan Apr 18 '17 at 05:35

How to assign default value in Dropdownboxlist?

1 Answers1