I am creating a web app in which i am using dropdown and angularjs for updating my database,
this is my syntax of my dropdownlist
<select ng-model="ucomname" ng-change="uucomname(o)">
<option ng-repeat="o in comnamelistfun" value="{{o.comname}}">{{o.comname}}</option>
</select>
first value in this dropdown is coming blank but i want the first value of my dropdown to be the first value of my dropdown, when i used ng-init i am not able to send the value in ng-model any idea?
On
First in your Controller,
app.controller('cardController', ['$scope',
function($scope) {
$scope.ucomname = $scope.comnamelistfun[0]
}])
Then the select box is,
<select ng-model="ucomname" ng-change="uucomname(o)" ng-options="o for o in comnamelistfun">
</select>
This shld work for you.
On
You can use this. http://plnkr.co/edit/1EVs7R20pCffewrG0EmI?p=preview
(function() {
'use strict';
angular
.module('app', [])
.controller('HomeCtrl', HomeCtrl);
HomeCtrl.$inject = ['$scope'];
function HomeCtrl($scope) {
$scope.cities = [
{ id: 1, name: 'London' },
{ id: 2, name: 'Chicago' },
{ id: 3, name: 'Moscow' },
{ id: 4, name: 'Mumbai' },
{ id: 5, name: 'Casablanca' }
];
// Pre-select city by id
$scope.selectedCityId = 1;
// Pre-select city by object
$scope.selectedCity = { id: 1, name: 'Casablanca' };
}
})();
<!DOCTYPE html>
<html ng-app="app">
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body ng-controller="HomeCtrl">
<h3>Data List</h3>
<table>
<tbody>
<tr ng-repeat="city in cities">
<td>{{city.id}}</td>
<td>{{city.name}}</td>
</tr>
</tbody>
</table>
<h3>Selected City (by Id)</h3>
selectedCityId: <strong>{{selectedCityId}}</strong>
<br/>
<br/>
<label>Select City
<select ng-model="selectedCityId" ng-options="city.id as city.name for city in cities">
<option value="">-- Select City --</option>
</select>
</label>
<hr/>
<h3>Selected City (by object)</h3>
selectedCity: <strong>{{selectedCity}}</strong>
<br/>
<br/>
<label>Select City
<select ng-model="selectedCity" ng-options="city as city.name for city in cities track by city.id">
<option value="">-- Select City --</option>
</select>
</label>
<hr/>
<!-- Scripts -->
<script data-require="[email protected]" data-semver="1.5.6" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="HomeCtrl.js"></script>
</body>
</html>
Try this code.
and in your controller. Put this.
I hope it should work :)