# Proper way to populate Ember.Select

**URL:** <https://discuss.emberjs.com/t/proper-way-to-populate-ember-select/1611>\
**Category:** Uncategorized\
**Created:** [June 25, 2013, 2:52am UTC](https://discuss.emberjs.com/t/proper-way-to-populate-ember-select/1611 "2013-06-25T02:52:24Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![RyanHirsch](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ryanhirsch/32/14593_2.png) [@RyanHirsch](https://discuss.emberjs.com/u/RyanHirsch)\
**Post date:** [June 25, 2013, 2:52am UTC](https://discuss.emberjs.com/t/proper-way-to-populate-ember-select/1611/1 "2013-06-25T02:52:24Z")

</div>

I have the following JSbin in which I am trying to create a basic ordering system using ember-data.

[http://jsbin.com/ibazom/3](http://jsbin.com/ibazom/3)

Each order needs to be tied to a customer and I know I need to populate the property (eligibleCustomers) to bind to the Ember.Select, but I don’t quite know where to do it.

Then I need to update the orders/new template with

```
{{view Ember.Select
  contentBinding="eligibleCustomers"
  optionLabelPath="content.name"
  optionValuePath="content.id"
}}

```

I am also getting an error when going to /orders that I can’t figure out

```
TypeError: Cannot read property 'length' of null 

```

---

<div class="post-metadata">

**Author:** ![RyanHirsch](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ryanhirsch/32/14593_2.png) [@RyanHirsch](https://discuss.emberjs.com/u/RyanHirsch)\
**Post date:** [June 29, 2013, 4:37pm UTC](https://discuss.emberjs.com/t/proper-way-to-populate-ember-select/1611/2 "2013-06-29T16:37:40Z")

</div>

Cross posted to [Stack Overflow](http://stackoverflow.com/questions/17331556/proper-way-to-populate-ember-select) and got an answer.

```
App.OrdersNewController = Ember.ObjectController.extend({
  needs: ['customers'],
  eligibleCustomers: function() {
    return this.get('controllers.customers');
  }.property(),
});

```

In the corresponding Ember.Select you need to bind to a property like selectedCustomer to allow you to use when saving the record.

```
{{view Ember.Select
  contentBinding="eligibleCustomers"
  valueBinding='selectedCustomer'
  optionLabelPath="content.name"
  optionValuePath="content.id"
}}

```

For the OrderNewController to work you have to give it a new order object in the setupController so that the description and other properties correspond to the model for it since its an ObjectController

```
App.OrdersNewRoute = Ember.Route.extend({
  setupController: function(controller) {
    controller.set('model', App.Order.createRecord({}));
  }
});

```

Finally in the createUser method, the transitionTo is deprecated. You want to use transitionToRoute instead.

```
createUser: function() {
  var model = this.get('model');
  var selectedCustomer = this.get('selectedCustomer');
  var customer = App.Customer.find(selectedCustomer);
  model.set('customer', customer);
  model.set('dateOfOrder', new Date());
  model.save();

  this.transitionToRoute('orders');
}

```