Answered by:
MVC dropdownlist don't select item with value pass from ng-model ?

Question
-
User-1846805900 posted
Hi
i here try to edit data thou angularjs and i got all data in view - but the only problem is that the dropdownlist don't select the value that passed to it and i don't know why ?
JS Code:
function getCustomer() { var promiseGetStudent = SPACRUDService.getCustomer(ShareData.value); promiseGetStudent.then(function (pl) { pl.data.MirageDate = $filter('date')(pl.data.MirageDate, 'yyyy-MM-dd'); $scope.Cust = pl.data; }, function (errorPl) { $scope.error = 'failure loading Student', errorPl; }); }
HTML Code:
<table class="table"> <td style="width:200px; text-align:center; vertical-align:central">إسم العميل</td> <td> <table class="table" style="margin-bottom: -3px;"> <tr> <td style="padding:0; vertical-align:central; width:50%;"> <div class="input-group"> <span class="input-group-addon ion ion-person"></span> <input type="text" class="form-control" placeholder="إسم العميل" ng-model="Cust.CustomerName"> </div> </td> <td style="width:125px; vertical-align:central" class="text-center">المدينة</td> <td style="padding:0; vertical-align:central"> <input type="text" ng-model="Cust.CityID" name="cid" id="cid" /> @Html.DropDownList("CityID", null, "إختر المدينة", htmlAttributes: new { @class = "form-control", @style = "width=100%", @ng_model = "Cust.CityID" }) </td> </tr> </table> </td> </tr> </table>
API Code:
[ResponseType(typeof(Customer))] public IHttpActionResult GetCustomer(int id) { Customer customer = db.Customers.Find(id); if (customer == null) { return NotFound(); } return Ok(customer); }
and i got result as:
as you can see i get the value of "CityID" but the dropdownlist don't select it from items on it, and when i look into html of dropdownlist i found that:
<select class="form-control ng-pristine ng-untouched ng-valid" id="CityID" name="CityID" ng-model="Cust.CityID" style="width=100%"> <option value="? number:2 ?"></option> // this the value in Cust.CityID ??!!!!!!!!! <option value="" disabled="disabled">إختر المدينة</option> <option value="1">06-أكتوبر</option> <option value="2">أبو زعبل</option> <option value="3">أوتوستراد</option> <option value="4">البدرشين</option> </select>
so please what is the problem here ?
Wednesday, July 8, 2015 9:41 AM
Answers
-
User-1846805900 posted
Thanks a lot Krunal
it works when i use ng-options and it done now ...
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Sunday, July 12, 2015 8:07 PM
All replies
-
User1644755831 posted
Hello a.amin,
Please see this: https://docs.angularjs.org/api/ng/directive/select
AS per documentation "The value of a select directive used without ngOptions is always a string. When the model needs to be bound to a non-string value, you must either explictly convert it using a directive or use ngOptions to specify the set of options. This is because an option element can only be bound to string values at present."
Create a directive to convert string to number and try.
angular.module('nonStringSelect', []) .run(function($rootScope) { $rootScope.model = { id: 2 }; }) .directive('convertToNumber', function() { return { require: 'ngModel', link: function(scope, element, attrs, ngModel) { ngModel.$parsers.push(function(val) { return parseInt(val, 10); }); ngModel.$formatters.push(function(val) { return '' + val; }); } }; });
Hope this helps.
With Regards,
Krunal Parekh
Thursday, July 9, 2015 10:12 PM -
User-1846805900 posted
Thanks a lot Krunal
it works when i use ng-options and it done now ...
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Sunday, July 12, 2015 8:07 PM