Issue
I have an Edit Page there I have an drop down called Role, while inserting I sent a value (like 1 instead "Role Name") to db, while retrieving to edit page I couldn't able to initialize the selected text in drop down
below is my html code
<label class="adjust1-label-right">Role</label>
<select id="role" class="adjust-select-combo" ng-options="r.role_name for r in Role_Name track by r.roleid" ng-model="role">
<option ng-repeat="rol.roleid for rol in Role_Name" value="{{rol.roleid}}">{{rol.role_name}}</option>
</select>
I tried this but no luck
$scope.role = $scope.Role_Name[0];
My data looks like
[{"Role_Id":1,"User_Id":10001}]
Solution
Your binding won't work, because you are using ng-options in your select along with ng-repeat in your options, only one of them should be used.
And use ng-value instead of value, this is how should be your HTML binding:
<select id="role" class="adjust-select-combo" ng-model="role">
<option ng-selected="rol == role"
ng-repeat="rol in Role_Name"
ng-value="rol.Role_Id">{{rol.User_Id}}
</option>
</select>
Demo:
This is a working Snippet:
var app = angular.module('app', []);
app.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
$scope.Role_Name = [{
"Role_Id": 1,
"User_Id": 10001
}, {
"Role_Id": 2,
"User_Id": 10002
}, {
"Role_Id": 3,
"User_Id": 10003
}];
$scope.role = $scope.Role_Name[1];
}]);<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
<html ng-app="app">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>
<body>
<div ng-controller="MainCtrl">
<select id="role" class="adjust-select-combo" ng-model="role">
<option ng-selected="rol == role"
ng-repeat="rol in Role_Name"
ng-value="rol.Role_Id">{{rol.User_Id}}
</option>
</select>
</div>
</body>
</html>Answered By - cнŝdk
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.