Merge pull request #16 from s-eckard/develop

Fix gap between dropdown menu and select
davidstutz · Jun 2, 2021 · 7c7fede · 7c7fede
2 parents 6fd420a + 61fe50b
commit 7c7fede
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 1 deletion.
diff --git a/dist/js/bootstrap-multiselect.js b/dist/js/bootstrap-multiselect.js
@@ -1282,6 +1282,8 @@
                                 this.updateOptGroups();
                             }
 
+                            this.updatePopupPosition();
+
                             this.options.onFiltering(event.target);
 
                         }, this), 300, this);
@@ -1290,6 +1292,28 @@
             }
         },
 
+        updatePopupPosition: function() {
+            // prevent gaps between popup and select when filter is used (#1199)
+
+            var transformMatrix = this.$popupContainer.css("transform");
+            var matrixType = transformMatrix.substring(0, transformMatrix.indexOf('('));
+            var values = transformMatrix.substring(transformMatrix.indexOf('(') + 1, transformMatrix.length - 1);
+            var valuesArray = values.split(',');
+
+            var valueIndex = 5;
+            if(matrixType === "matrix3d") {
+                valueIndex = 13;
+            }
+
+            var yTransformation = valuesArray[valueIndex].trim();
+            if (yTransformation < 0) {
+                yTransformation = this.$popupContainer.css("height").replace('px', '') * -1;
+                valuesArray[valueIndex] = yTransformation;
+                transformMatrix = matrixType + '(' + valuesArray.join(',') + ')';
+                this.$popupContainer.css("transform", transformMatrix);
+            }
+        },
+
         /**
          * Unbinds the whole plugin.
          */