0

I am creating a web app in which i am using c# with angularjs

currently i am updating my records in which i have one dropdownlist called zone which looks like this

<select ng-model="uzone" ng-change="locationupd(c)">
  <option ng-repeat="l in gzone" value="{{l.jzone}}">{{l.jzone}}</option>
</select>

but the first field in the dropdown is showing blank instead of the first value of zone

can anybody help me out here?

4 Answers4

0

Hello you can take a look at ngOption: https://docs.angularjs.org/api/ng/directive/ngOptions

runit
  • 376
  • 1
  • 8
0

Try this : 

<select ng-model="uzone" ng-change="locationupd(c)">
  <option ng-repeat="l in gzone" ng-value="l.jzone">{{l.jzone}}</option>
</select>
Jigar7521
  • 1,549
  • 14
  • 27
0

I dealt with a similar situation yesterday at work.
My drop down list had to list the names of all countries.
I am now able to set a default value for the drop down list.
Please change the code according to your needs.

What I had to do: Set CH/Switzerland as default value for vm.selectedCountry.

CodePen code (using select):
Sample:

<select class="selector" ng-model="vm.selectedCountry" ng-options="country.name for country in vm.countries" ng-init="vm.selectedCountry = {'name': 'Switzerland', 'code': 'CH', 'init': true}">

<!--shows only when ng-init is run-->
    <option value="" ng-show="vm.selectedCountry.init">Switzerland</option>

</select>

Drop-down List (AngularJS): Adding default value using select, ng-init and ng-show

CodePen code (using md-select and Angular Material):
Sample:

<md-select ng-model="vm.selectedCountry" ng-init="vm.selectedCountry = vm.selectedCountry?selectedCountry : 'CH';">

                    <md-option ng-value="'CH'" ng-selected="vm.selectedCountry == 'CH'?true:false">Switzerland</md-option>

                    <md-option ng-repeat="country in vm.countries" ng-value="country.code">
                        {{country.name}}
                    </md-option>
</md-select>

Drop-down List (AngularJS): Adding default value using md-select, ng-init and ng-selected

In the above one, the default value is spliced from the array and put first in md-select (else, duplication occurs).

Ramsing Nadeem
  • 101
  • 1
  • 12
0

use a $scope variable to select the option first.

in my case i have $scope.opt = $scope.items[0];

 angular
                .module("myModule", [])
                .controller("myController", ['$scope', function ($scope) {
                     $scope.items = [{id: 1,label: 'aLabel'}, {id: 2,label: 'bLabel'},{id: 3,label: 'cLabel'}, {id: 4,label: 'dLabel'}, {id: 5,label: 'eLabel'}, {id: 6,label: 'fLabel'}, {id: 7,label: 'gLabel'}];
                    $scope.opt = $scope.items[0];
                }]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myModule" >
    <div ng-controller="myController">
  <select ng-model="opt" ng-options="i as i.label for i in items track by i.id ">
        <option value="">Select ALL</option>
    </select><br />
    </div>
</body>
42HacK
  • 34
  • 8