Batman.js Select2 Custom View

select_2_view.coffee

# Props to @theberg for making this
#
# usage:
#
# select data-view='Select2View' data-view-bind='item.option_id'
#   option value='' None
#   option data-foreach-opt='Option.all' data-bind='opt.name' data-bind-value='opt.id'
#
class App.Select2View extends Batman.View
  @option 'bind', 'placeholder'
  constructor: ->
    super
    @on 'childBindingAdded', @childBindingAdded

  _addChildBinding: (binding) ->
    super
    @fire('childBindingAdded', binding)

  ready: ->
    unless @select2
      options = { minimumResultsForSearch: 12 }
      if placeholder = @get('placeholder')
        options.placeholder = placeholder
      @select2 = $(@node).select2(options)
      @select2.on 'change', @select2Changed
    @dataChanged()

  select2Changed: =>
    new_value = parseInt(@select2.select2("val"), 10)
    new_value = @select2.select2("val") if isNaN(new_value)
    @set 'bind', new_value

  childBindingAdded: (binding) =>
    if binding instanceof Batman.DOM.IteratorBinding
      binding.backingView.on 'itemsWereRendered', => @dataChanged()
    @dataChanged()

  dataChanged: ->
    if @select2 and (typeof @bind isnt 'undefined')
      @select2.select2("val", @bind)

  @accessor 'bind',
    get: ->
      @bind
    set: (name, value) ->
      @bind = value
      @dataChanged()