CODEWITHSUNDEEP
angularjs
Bhawna Malhotra
Bhawna Malhotra

Reputation: 490

Showing an empty as first option in select tag

My app is showing an empty select field as first entry. I have read the other solution given and tried it but still its not working.

My controller code is:

.controller('userCreateController', function(User,Profile,Auth) {
      alert("hello");
      var vm = this;
      vm.type = 'create';
     Profile.all() //this service fetch all profiles to be shown in select field
     .success(function(data){
      vm.profile = data;

});
vm.userData.profile = vm.profile[0]; //here i have set default value for select field

And my html page is:

<label class="col-sm-2 control-label">Profile</label>
<div class="col-sm-8">
  <select ng-model="user.userData.profile" ng-options="person._id  as person.profileName for person in user.profile">
  </select>
</div>

Hierarchy of vm.profile

{
  "_id": 46,
  "profile": ObjectId("5516498e95b84548156db754"),
  "isActive": true,
  "password": "$2a$10$h8WTqsbNzTA5EqUcPUllYOCSjt0YDCBULEvDcntkg/muEHpAwX/xO",
  "username": "admin",
  "name": "admin",
  "reciptBook": [],
  "__v": 0
}, {
  "_id": 48,
  "profile": ObjectId("55168b8fbf769e6407ae3603"),
  "isActive": false,
  "password": "$2a$10$DnE84kyL9LI8tE3Fxet5su2ysjzRwnDXeriWOui3iDAki6eb53qn.",
  "username": "hello",
  "name": "hello",
  "reciptBook": [],
  "__v": 0
}

Upvotes: 1

Views: 67

Answers (2)

IvanZh
IvanZh

Reputation: 2290

Try to add empty option, that will have an undefined value.

<select ng-model="user.userData.profile" ng-options="person._id  as person.profileName for person in user.profile">
  <option value=""></option>
</select>

Upvotes: 1

squiroid
squiroid

Reputation: 14037

Use vm.userData.profile = vm.profile[0]._id; because in your model you are setting person._id in you select.

UPDATE:-

I added the minimum possble required plunker for you please check. Plunker

Upvotes: 0

Related Questions