Merge pull request #104 from caseyjhol/master

Add container option (#83, #37)
snapappointments · Apr 2, 2013 · 92d9721 · 92d9721
2 parents 402ab60 + e97bd97
commit 92d9721
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 11 deletions.
diff --git a/bootstrap-select.js b/bootstrap-select.js
@@ -29,12 +29,19 @@
         constructor: Selectpicker,
 
         init: function (e) {
-            this.$element.hide();
+            if (!this.options.container) {
+                this.$element.hide();
+            } else {
+                this.$element.css('visibility','hidden');
+            };
             this.multiple = this.$element.prop('multiple');                
             var classList = this.$element.attr('class') !== undefined ? this.$element.attr('class').split(/\s+/) : '';
             var id = this.$element.attr('id');
             this.$element.after( this.createView() );
             this.$newElement = this.$element.next('.bootstrap-select');
+            if (this.options.container) {
+                this.selectPosition();
+            }
             this.button = this.$newElement.find('> button');
             if (id !== undefined) {
                 this.button.attr('id', id);
@@ -199,7 +206,7 @@
                 title = _this.options.title != undefined ? _this.options.title : _this.options.noneSelectedText;    
             }
 
-            this.$element.next('.bootstrap-select').find('.filter-option').html( title );
+            _this.$newElement.find('.filter-option').html( title );
         },
 
         setSize:function() {
@@ -248,11 +255,21 @@
              }
         },
 
+        selectPosition:function() {
+            var selectElementTop = this.$element.offset().top;
+            var selectElementLeft = this.$element.offset().left;
+            this.$newElement.appendTo(this.options.container);
+            this.$newElement.css({'position':'absolute', 'top':selectElementTop+'px', 'left':selectElementLeft+'px'});
+        },
+
         refresh:function() {
             this.reloadLi();
             this.render();
             this.setSize();
             this.checkDisabled();
+            if (this.options.container) {
+                this.selectPosition();
+            }
         },
 
         setSelected:function(index, selected) {
@@ -277,6 +294,9 @@
                 this.button.click(function(e) {
                     e.preventDefault();
                 });
+                this.button.on('focusin', function() {
+                    $(this).blur();
+                });
             } else if (!this.$element.is(':disabled') && this.button.hasClass('disabled')) {
                 this.button.removeClass('disabled');
                 this.button.click(function() {
@@ -311,20 +331,20 @@
                 e.preventDefault();
 
                 //Dont run if we have been disabled
-                if ($select.prev('select').not(':disabled') && !$(this).parent().hasClass('disabled')){
+                if (_this.$element.not(':disabled') && !$(this).parent().hasClass('disabled')){
                     //Deselect all others if not multi select box
                     if (!_this.multiple) {
-                        $select.prev('select').find('option').removeAttr('selected');
-                        $select.prev('select').find('option').eq(clickedIndex).prop('selected', true).attr('selected', 'selected');
+                        _this.$element.find('option').removeAttr('selected');
+                        _this.$element.find('option').eq(clickedIndex).prop('selected', true).attr('selected', 'selected');
                     } 
                     //Else toggle the one we have chosen if we are multi selet.
                     else {
-                        var selected = $select.prev('select').find('option').eq(clickedIndex).prop('selected');
+                        var selected = _this.$element.find('option').eq(clickedIndex).prop('selected');
 
                         if(selected) {
-                            $select.prev('select').find('option').eq(clickedIndex).removeAttr('selected');
+                            _this.$element.find('option').eq(clickedIndex).removeAttr('selected');
                         } else {
-                            $select.prev('select').find('option').eq(clickedIndex).prop('selected', true).attr('selected', 'selected');
+                            _this.$element.find('option').eq(clickedIndex).prop('selected', true).attr('selected', 'selected');
                         }
                     }
 
@@ -334,7 +354,7 @@
 
                     // Trigger select 'change'
                     if (prevIndex != clickedIndex) {
-                        $select.prev('select').trigger('change');
+                        _this.$element.trigger('change');
                     }
 
                     _this.render();
@@ -423,7 +443,8 @@
         title: null,
         selectedTextFormat : 'values',
         noneSelectedText : 'Nothing selected',
-        width: null
+        width: null,
+        container: false
     }
 
 }(window.jQuery);