Updated bootstrap combobox

public/js/bootstrap-combobox.js

@@ -1,5 +1,5 @@
 /* =============================================================
- * bootstrap-combobox.js v1.1.5
+ * bootstrap-combobox.js v1.1.6
  * =============================================================
  * Copyright 2012 Daniel Farrell
  *
@@ -25,6 +25,7 @@
 
   var Combobox = function ( element, options ) {
     this.options = $.extend({}, $.fn.combobox.defaults, options);
+    this.template = this.options.template || this.template
     this.$source = $(element);
     this.$container = this.setup();
     this.$element = this.$container.find('input[type=text]');
@@ -46,12 +47,25 @@
     constructor: Combobox
 
   , setup: function () {
-      var combobox = $(this.options.template);
+      var combobox = $(this.template());
       this.$source.before(combobox);
       this.$source.hide();
       return combobox;
     }
 
+  , disable: function() {
+      this.$element.prop('disabled', true);
+      this.$button.attr('disabled', true);
+      this.disabled = true;
+      this.$container.addClass('combobox-disabled');
+    }
+
+  , enable: function() {
+      this.$element.prop('disabled', false);
+      this.$button.attr('disabled', false);
+      this.disabled = false;
+      this.$container.removeClass('combobox-disabled');
+    }
   , parse: function () {
       var that = this
         , map = {}
@@ -82,32 +96,26 @@
     }
 
   , transferAttributes: function() {
-    this.options.placeholder = this.$source.attr('data-placeholder') || this.options.placeholder;
+    this.options.placeholder = this.$source.attr('data-placeholder') || this.options.placeholder
-    this.$element.attr('placeholder', this.options.placeholder);
+    this.$element.attr('placeholder', this.options.placeholder)
-    this.$target.prop('name', this.$source.prop('name'));
+    this.$target.prop('name', this.$source.prop('name'))
-    this.$target.val(this.$source.val());
+    this.$target.val(this.$source.val())
-    this.$source.removeAttr('name');  // Remove from source otherwise form will pass parameter twice.
+    this.$source.removeAttr('name')  // Remove from source otherwise form will pass parameter twice.
-    this.$element.attr('required', this.$source.attr('required'));
+    this.$element.attr('required', this.$source.attr('required'))
-    this.$element.attr('rel', this.$source.attr('rel'));
+    this.$element.attr('rel', this.$source.attr('rel'))
-    this.$element.attr('title', this.$source.attr('title'));
+    this.$element.attr('title', this.$source.attr('title'))
-    this.$element.attr('class', this.$source.attr('class'));
+    this.$element.attr('class', this.$source.attr('class'))
-    this.$element.attr('tabindex', this.$source.attr('tabindex'));
+    this.$element.attr('tabindex', this.$source.attr('tabindex'))
-    this.$source.removeAttr('tabindex');
+    this.$source.removeAttr('tabindex')
-    this.$source.removeAttr('required');
+    if (this.$source.attr('disabled')!==undefined)
-  }
+      this.disable();
-
-  , setSelected: function() {
-    this.selected = true;
   }
 
   , select: function () {
       var val = this.$menu.find('.active').attr('data-value');
-      this.$element.val(this.updater(val));
+      this.$element.val(this.updater(val)).trigger('change');
-      this.$target.val(this.map[val]);
+      this.$target.val(this.map[val]).trigger('change');
-      this.$source.val(this.map[val]);
+      this.$source.val(this.map[val]).trigger('change');
-      this.$element.trigger('change');
-      this.$target.trigger('change');
-      this.$source.trigger('change');
       this.$container.addClass('combobox-selected');
       this.selected = true;
       return this.hide();
@@ -130,12 +138,16 @@
         })
         .show();
 
+      $('.dropdown-menu').on('mousedown', $.proxy(this.scrollSafety, this));
+
       this.shown = true;
       return this;
     }
 
   , hide: function () {
       this.$menu.hide();
+      $('.dropdown-menu').off('mousedown', $.proxy(this.scrollSafety, this));
+      this.$element.on('blur', $.proxy(this.blur, this));
       this.shown = false;
       return this;
     }
@@ -161,6 +173,14 @@
       return this.render(items.slice(0, this.options.items)).show();
     }
 
+  , template: function() {
+      if (this.options.bsVersion == '2') {
+        return '<div class="combobox-container"><input type="hidden" /> <div class="input-append"> <input type="text" autocomplete="off" /> <span class="add-on dropdown-toggle" data-dropdown="dropdown"> <span class="caret"/> <i class="icon-remove"/> </span> </div> </div>'
+      } else {
+        return '<div class="combobox-container"> <input type="hidden" /> <div class="input-group"> <input type="text" autocomplete="off" /> <span class="input-group-addon dropdown-toggle" data-dropdown="dropdown"> <span class="caret" /> <span class="glyphicon glyphicon-remove" /> </span> </div> </div>'
+      }
+    }
+
   , matcher: function (item) {
       return ~item.toLowerCase().indexOf(this.query.toLowerCase());
     }
@@ -224,24 +244,27 @@
     }
 
   , toggle: function () {
-    if (this.$container.hasClass('combobox-selected')) {
+    if (!this.disabled) {
-      this.clearTarget();
+      if (this.$container.hasClass('combobox-selected')) {
-      this.triggerChange();
+        this.clearTarget();
-      this.clearElement();
+        this.triggerChange();
-    } else {
-      if (this.shown) {
-        this.hide();
-      } else {
         this.clearElement();
-        this.lookup();
+      } else {
+        if (this.shown) {
+          this.hide();
+        } else {
+          this.clearElement();
+          this.lookup();
+        }
       }
     }
-
-    this.$element.trigger('change');
-    this.$target.trigger('change');
-    this.$source.trigger('change');    
   }
 
+  , scrollSafety: function(e) {
+      if (e.target.tagName == 'UL') {
+          this.$element.off('blur');
+      }
+  }
   , clearElement: function () {
     this.$element.val('').focus();
   }
@@ -333,12 +356,9 @@
         case 37: // left arrow
         case 36: // home
         case 35: // end
-        case 33: // page up
-        case 34: // page down
         case 16: // shift
         case 17: // ctrl
         case 18: // alt
-        case 20: // cap lock
           break;
 
         case 9: // tab
@@ -397,7 +417,6 @@
 
   /* COMBOBOX PLUGIN DEFINITION
    * =========================== */
-
   $.fn.combobox = function ( option ) {
     return this.each(function () {
       var $this = $(this)
@@ -409,11 +428,11 @@
   };
 
   $.fn.combobox.defaults = {
-  template: '<div class="combobox-container"> <input type="hidden" /> <div class="input-group"> <input type="text" autocomplete="off" /> <span class="input-group-addon dropdown-toggle" data-dropdown="dropdown"> <span class="caret" /> <i class="fa fa-times"></i> </span> </div> </div> '
+    bsVersion: '3'
   , menu: '<ul class="typeahead typeahead-long dropdown-menu"></ul>'
   , item: '<li><a href="#"></a></li>'
   };
 
   $.fn.combobox.Constructor = Combobox;
 
-}( window.jQuery );
+}( window.jQuery );