Dropdown checkbox

var Dropdown;

  Dropdown = (function() {
    function Dropdown($el, options) {
      this.options = options;
      this.$el = $el;
      this.setup()
    };

    Dropdown.prototype.defaults = {
      multiple: {
        elementTemplate: '<li><input class="dropdown-checkbox" data-tab-index="<%- index %>" id="checkbox-<%- selectName %>-<%- value %>" name="checkbox-<%- selectName %>-<%- value %>" type="checkbox"><label for="checkbox-<%- selectName %>-<%- value %>"><%- label %></label></li>',
        dropdownContainerTemplate: (function () {/*
          <div class="jw_checkbox_dropdown">
            <input class="checkbox_input jw_input required" name="input-<%- selectName %>" type="text" value="">
            <div class="arrow_down">
              <div class="icon"></div>
            </div>
            <ul class="hidden dropdown-container">
            </ul>
            <div class="dropdown_overlay hidden"></div>
          </div>
          */}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1]
      }
    };

    Dropdown.prototype.setup = function() {
      var $el = this.$el;

      if ($el.attr('multiple')) {
        var elementTemplate = _.template(this.defaults.multiple.elementTemplate);

        var options = _.map($el.find('option'), function(option, index){
          return {
            value: $(option).val(),
            label: $(option).text(),
            index: index,
            selectName: $el.attr('name')
          }
        });

        var containerTemplate = _.template(this.defaults.multiple.dropdownContainerTemplate);
        var $dropdown = $(containerTemplate({selectName: $el.attr('name')}));
        $dropdown.insertAfter($el);
        debugger
        var $container = $dropdown.find('.dropdown-container');
        _.each(options, function(option){
          if(option.value) {
            $container.append(elementTemplate(option));
          }
        });

      }

      var $checkBoxDropdown = $dropdown;
      var $input = $checkBoxDropdown.find('input[type="text"]').eq(0);
      var $uList = $checkBoxDropdown.find('ul');
      var $overlay = $checkBoxDropdown.find(".dropdown_overlay");

      // preventing input from editing
      // because disabled="disabled" prevents it from validation
      $input.bind('focus', function(e) {
        $(this).trigger('blur');
      });

      $checkBoxDropdown.find(".arrow_down, input[type=text]").bind("click", function() {
        $overlay.removeClass("hidden");
        $uList.removeClass("hidden");
      });

      $overlay.bind("click", function() {
        $(this).addClass("hidden");
        $uList.addClass("hidden");
        $checkBoxDropdown.trigger("changed", {});
      });

      $checkBoxDropdown.find("input[type=checkbox]").change(function() {
        var text = "";
        Array.prototype.reverse.call($checkBoxDropdown.find("input[type=checkbox]:checked")).each(function() {
          if (text.length != 0) {
            text += ", ";
          }
          text += $(this).siblings('label').text();
        });
        $input.val(text);
      });

      this.$el.addClass('hidden')
    };

    $.fn.dropdown = function(options) {
        var dropdown = new Dropdown(this, options);

        this.data('dropdown', dropdown);
        return this;
    };

  }($, _));