Angularjs How to remove the empty in the selectbox or AngularJS empty first element in dropdown list or if i load the data from json to selctbox or dropdown the first element is coming as empty, so how we remove that empty in selectbox:
<!doctype html>
<html lang="en" ng-app="app">
<head>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.angularjs.org/angular-1.0.0.min.js"></script>
<script src="http://code.angularjs.org/angular-resource-1.0.0.min.js"></script>
</head>
<body>
<div ng-controller="Ctrl">
<select id="sel" class="input-block-level" ng-model="list_category" ng-options="obj.id as obj.name for obj in list_categories.data">
<option value="">Other</option>
</select>
<p>$scope.list_category: {{list_category}}<p>
<div>
<script>
var app = angular.module('app', []);
function Ctrl($scope) {
$scope.list_categories = {
data: [{
id: 'id1',
name: 'name1'
}, {
id: 'id2',
name: 'name2'
}]
};
$scope.list_category = 'id2';
}
</script>
<style>
p {
margin-top: 10px;
}
</style>
</body>
</html>
<!doctype html>
<html lang="en" ng-app="app">
<head>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.angularjs.org/angular-1.0.0.min.js"></script>
<script src="http://code.angularjs.org/angular-resource-1.0.0.min.js"></script>
</head>
<body>
<div ng-controller="Ctrl">
<select id="sel" class="input-block-level" ng-model="list_category" ng-options="obj.id as obj.name for obj in list_categories.data">
<option value="">Other</option>
</select>
<p>$scope.list_category: {{list_category}}<p>
<div>
<script>
var app = angular.module('app', []);
function Ctrl($scope) {
$scope.list_categories = {
data: [{
id: 'id1',
name: 'name1'
}, {
id: 'id2',
name: 'name2'
}]
};
$scope.list_category = 'id2';
}
</script>
<style>
p {
margin-top: 10px;
}
</style>
</body>
</html>
No comments:
Post a Comment