An Ember wrapper for chosen multi-select

chosen-multi-select.js

//= require chosen-jquery

UiControls = window.UiControls || Ember.Namespace.create();

/**
 * Custom Multi-Select enabled with 'chosen'
 * @class
 * @memberOf UiControls
 * @extends Ember.Select
 *
 * @example
 * {{view UiControls.MultipleSelect contentBinding="<Ember.ArrayController>" optionValuePath="content.value" optionLabelPath="content.
 * label" selectionBinding="Ember.Array"}}
 *
 */
UiControls.MultipleSelect = Em.Select.extend({
  multiple: true,

  classNames: ['uicontrol-multiple-select'],

  attributeBindings: [ 'multiple' ],

  didInsertElement: function() {
    this._super();
    this.$().chosen();
  },

  selectionChanged: function() {
      this.$().trigger('liszt:updated');
  }.observes('selection')
});