behavior2 options example

multiselect.coffee

Behavior2.Class('multiselect', 'select.multiselect', {
  '!multiselect': #you can trigger 'multiselect' on any element, and any multiselects within that element will be refreshed. or $ctx.trigger('multiselect', 'rebuild')
    'body': 'updateSelf'

}, ($ctx, that) ->

  that.options =
    maxHeight: 200
    numberDisplayed: 10


  that.initialize = ->
    opts = _.extend(
      nonSelectedText: $ctx.attr('title')
      buttonClass: $ctx.data('ms-button-class')
      buttonWidth: $ctx.data('ms-width')
      maxHeight: $ctx.data('ms-height')
      numberDisplayed: $ctx.data('ms-size')
      checkboxName: 'multiselect_'+ ($ctx.attr("name") or  _.uniqueId())
    , that.options)

    $ctx.multiselect(opts)
    $ctx.multiselect('refresh')

  that.updateSelf = (e, command="refresh") ->
    if $ctx.data('multiselect') and $ctx.closest(e.target).length
      $ctx.multiselect(command)
)

options.js

//put this on the page where the multiselect is used
Behavior2.options('multiselect', {
    buttonText: function(options, select) {
        var extra = options.length ? ' +' + options.length : '';
        return this.nonSelectedText + extra + ' <b class="caret"></b>';
    },
    label: function(element) {
        var count = Behavior2.options('projectSearch')[element.value];  //'bookmarked' or 'hidden'
        var badge = _.isUndefined(count) ? "" : " <span class='badge pull-right'>"+count+"</span>";
        return $(element).text() + badge;
    }
});

// these options are 2 counts which are used by the multiselect on this page to show counts next to the options, 
// and also by another behavior which updates them as you bookmark and hide things
Behavior2.options('projectSearch', {
    'bookmarked': {{ bookmarked_count }},
    'hidden': {{ hidden_count }}
});

shim.js

//put this in the head 
Behavior2={_opts:{},_cls:[],contentChanged:function(){},get:function(){}};
Behavior2.options=function(name, obj){Behavior2._opts[name]=obj};
Behavior2.Class=function(){Behavior2._cls.push(arguments)};