althaf hussain althaf hussain - 2 months ago 10
AngularJS Question

angularjs Why dropdown not binding values in it

Here I'm fetching data from DataBase using where condition here every textbox showing value but why dropdown not showing values

<select ng-options="I.CountryID as I.CountryName for I in CountryList" ng-model="CountryID">
<option value="{{CountryName}}">{{CountryName}</option>


angular.js

$scope.EditEmp = function (xxx) {
GetAllCountryList(); var ser = Myservice.EditByid(xxx.Id);
ser.then(function (d) {
$scope.Name = xxx.Name;
$scope.CountryID = xxx.CountryID; //This is my Dropdownlist
$('#modalpopup').modal('show')
}
}

Answer

Post here what you get in console on inspect element

Anyway, here's a simple example of what you are trying to do, this snippet was taken from angularjs site, hope it will help you.

angular.module('defaultValueSelect', [])
 .controller('ExampleController', ['$scope', function($scope) {
   $scope.data = {
    availableOptions: [
      {id: '1', name: 'Option A'},
      {id: '2', name: 'Option B'},
      {id: '3', name: 'Option C'}
    ],
    selectedOption: {id: '3', name: 'Option C'} //This sets the default value of the select in the ui
    };
}]);
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="defaultValueSelect" ng-controller="ExampleController">
  <form name="myForm">
    <label for="mySelect">Make a choice:</label>
    <select name="mySelect" id="mySelect"
      ng-options="option.name for option in data.availableOptions track by option.id"
      ng-model="data.selectedOption"></select>
  </form>
  <hr>
  <tt>option = {{data.selectedOption}}</tt><br/>
</div>

</html>

Comments