Radio button implementation in Ember.js The checked radio button currently does not change is value appropriately when the switching from model to model. Gender is assumed to be a binary choice in cats for the purposes of a breakable toy.

_form.handlebars

<p>
  <label>
    {{ view CatWorld.RadioButton name="genderSelection"
    contentBinding="controller.gender" selectionBinding="gender" value="Male" id="Male" }}

    Male
  <label>

  <label>
    {{ view CatWorld.RadioButton name="genderSelection"
    contentBinding="controller.gender" selectionBinding="gender" value="Female" id="Female" }}

    Female
  <label>
</p>

radio_button.js.coffee

CatWorld.RadioButton = Ember.View.extend
  tagName: "input"
  type: "radio"
  attributeBindings: [ "name", "type", "value", "checked:checked" ]
  click: ->
    @set("controller.gender", @$().val())
  checked: ( ->
    @get("value") == @get('controller.gender')
  ).property()
  modelChanged: ( ->
    @rerender()
  ).observes('controller.model')