AngularJS - extra blank option added using ng-repeat in select tag
Any time you see <option value="?" selected="selected"></option>
in the select, it means that your ng-model
is set to a value that isn't in the ng-options
. So, if you don't want the blank option, you need to make sure item
is set to a value in your itemlist
. This could be as easy as having the following in your controller:
$scope.item = $scope.itemlist[0];
This will give it an inital value, and then angular will update it for you thereafter.
simplest way to make sure that automatically added option by angular is hidden is ng-if directive.
<select ng-options="option.id as option.description for option in Options"> <option value="" ng-if="false"></option></select>
I have found the solution after a long RNDPlease find the following code it will work for you.
Here is the HTML Code
<div class="col-xs-3" ng-controller="GetUserADDetails"> <label>Region</label> <select id="DDLRegion" ng-model="selectedregion" class="form-control" ng-change="getBranched(selectedregion)"> <option value="" >--Select Region--</option> <option ng-repeat="region in Regions" value="{{region.LookupID}}">{{region.LookupValue}}</option> </select> </div>
Here is the Module Code
var app = angular.module("UserMasterModel", []) .controller("GetUserADDetails", function ($scope, $http,$log) { $http({ method: 'GET', url: '/UserMaster/GetAllRegion' }) .then(function (response) { $scope.Regions = response.data; //$log.info(response); });
});