I am unable to set the value of angular dropdownlist using mvc and rest api.
steps:
1. open the list page and select a record
2. navigate to another page where i can edit the selected record.
Issue:
when i navigate to page(edit page) 1st time the dropdown value is not set
when i go back to list page again and select record then dropdown value selected.
i am unable to understand what was wrong with it?
What I have tried:
HTML code:
<select ng-model="vm.CountryID">
<option ng-repeat="x in vm.country" value="{{x.countryID}}" ng-selected="{{x.countryID ==vm.CountryID}}" >{{x.countryName}}</option>
</select>
JS Code:
this.initializeController = function () {
vm.title = "Customer Maintenance";
vm.messageBox = "";
vm.alerts = [];
var city = new Object();
ajaxService.ajaxPost(city, "api/CityService/GetCity", this.getCityOnSuccess, this.getCityOnError);
var country = new Object();
ajaxService.ajaxPost(country, "api/CountryService/GetCountry", this.getCountryOnSuccess, this.getCountryOnError);
var customerID = ($routeParams.id || "");
if (customerID === "") {
vm.customerID = "0";
vm.customerName = "";
vm.customerAddress = "";
vm.CountryID = "1";
vm.CityID = "1";
vm.phoneNo = "(+92) 300-8888888";
}
else {
vm.customerID = customerID;
var customer = new Object();
customer.customerID = customerID;
ajaxService.ajaxPost(customer, "api/CustomerService/GetCustomer", this.getCustomerOnSuccess, this.getCustomerOnError);
}
};
this.getCustomerOnSuccess = function (response) {
vm.customerName = response.customerName;
vm.customerAddress = response.customerAddress;
vm.CityID = response.cityID;
vm.CountryID = response.countryID;
vm.phoneNo = response.phoneNo;
};
this.getCountryOnSuccess = function (response) {
vm.country = response.countries;
};