changed the version to 1.9.4. improved the visualization of the dropdown.

Author: Atanas Atanasov

Gijgo.GitHub.csproj

@@ -111,7 +111,9 @@
     <Content Include="examples\datepicker\DatePicker.Base.locale.Bulgarian.html" />
     <Content Include="examples\datepicker\DatePicker.Base.locale.French.html" />
     <Content Include="examples\datepicker\DatePicker.Base.locale.German.html" />
+    <Content Include="examples\datepicker\DatePicker.Base.locale.Italian.html" />
     <Content Include="examples\datepicker\DatePicker.Base.locale.Russian.html" />
+    <Content Include="examples\datepicker\DatePicker.Base.locale.Spanish.html" />
     <Content Include="examples\datepicker\DatePicker.Base.maxDate.Today.html" />
     <Content Include="examples\datepicker\DatePicker.Base.maxDate.Tomorrow.html" />
     <Content Include="examples\datepicker\DatePicker.Base.minDate.Bootstrap.4.html" />
@@ -209,6 +211,10 @@
     <Content Include="examples\dropdown\DropDown.Base.maxHeight.Auto.html" />
     <Content Include="examples\dropdown\DropDown.Base.maxHeight.Bootstrap.4.html" />
     <Content Include="examples\dropdown\DropDown.Base.maxHeight.Fixed.html" />
+    <Content Include="examples\dropdown\DropDown.Base.placeholder.Bootstrap.4.html" />
+    <Content Include="examples\dropdown\DropDown.Base.placeholder.Bootstrap.html" />
+    <Content Include="examples\dropdown\DropDown.Base.placeholder.HTML.Config.html" />
+    <Content Include="examples\dropdown\DropDown.Base.placeholder.JS.Config.html" />
     <Content Include="examples\dropdown\DropDown.Base.selectedField.sample.html" />
     <Content Include="examples\dropdown\DropDown.Base.textField.sample.html" />
     <Content Include="examples\dropdown\DropDown.Base.uiLibrary.Bootstrap.3.html" />

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "gijgo",
-  "version": "1.9.3",
+  "version": "1.9.4",
   "description": "Gijgo is a set of free open source javascript controls distributed under MIT License with built-in support for Bootstrap and Material Design",
   "main": [
     "./dist/combined/js/gijgo.js",

dist/combined/js/gijgo.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo JavaScript Library v1.9.3
+ * Gijgo JavaScript Library v1.9.4
  * http://gijgo.com/
  *
  * Copyright 2014, 2018 gijgo.com
@@ -13078,21 +13078,35 @@ gj.dropdown.methods = {
     },
 
     setListPosition: function (presenter, list, data) {
-        var top, listHeight, presenterHeight, newHeight,
-            mainElRect = presenter.getBoundingClientRect();
-
-        gj.core.setChildPosition(presenter, list);
+        var top, listHeight, presenterHeight, newHeight, listElRect,
+            mainElRect = presenter.getBoundingClientRect(),
+            scrollY = window.scrollY || window.pageYOffset || 0,
+            scrollX = window.scrollX || window.pageXOffset || 0;
 
         // Reset list size
         list.style.overflow = '';
         list.style.overflowX = '';
         list.style.height = '';
 
+        gj.core.setChildPosition(presenter, list);
+
         listHeight = gj.core.height(list, true);
+        listElRect = list.getBoundingClientRect();
         presenterHeight = gj.core.height(presenter, true);
-        if (!isNaN(listHeight) && data.maxHeight === 'auto' && (mainElRect.top + listHeight + presenterHeight) > window.innerHeight) {
-            newHeight = window.innerHeight - mainElRect.top - presenterHeight - 3;
-        } else if (!isNaN(listHeight) && !isNaN(data.maxHeight) && data.maxHeight < listHeight) {
+        if (data.maxHeight === 'auto') {
+            if (mainElRect.top < listElRect.top) { // The list is located below the main element
+                if (mainElRect.top + listHeight + presenterHeight > window.innerHeight) {
+                    newHeight = window.innerHeight - mainElRect.top - presenterHeight - 3;
+                }
+            } else { // The list is located above the main element                
+                if (mainElRect.top - listHeight - 3 > 0) {
+                    list.style.top = Math.round(mainElRect.top + scrollY - listHeight - 3) + 'px';
+                } else {
+                    list.style.top = scrollY + 'px';
+                    newHeight = mainElRect.top - 3;
+                }
+            }
+        } else if (!isNaN(data.maxHeight) && data.maxHeight < listHeight) {
             newHeight = data.maxHeight;
         }
 

dist/combined/js/gijgo.min.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo Checkbox v1.9.3
+ * Gijgo Checkbox v1.9.4
  * http://gijgo.com/checkbox
  *
  * Copyright 2014, 2018 gijgo.com

dist/modular/js/checkbox.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo JavaScript Library v1.9.3
+ * Gijgo JavaScript Library v1.9.4
  * http://gijgo.com/
  *
  * Copyright 2014, 2018 gijgo.com

dist/modular/js/core.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo DatePicker v1.9.3
+ * Gijgo DatePicker v1.9.4
  * http://gijgo.com/datepicker
  *
  * Copyright 2014, 2018 gijgo.com

dist/modular/js/datepicker.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo DateTimePicker v1.9.3
+ * Gijgo DateTimePicker v1.9.4
  * http://gijgo.com/datetimepicker
  *
  * Copyright 2014, 2018 gijgo.com

dist/modular/js/datetimepicker.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo Dialog v1.9.3
+ * Gijgo Dialog v1.9.4
  * http://gijgo.com/dialog
  *
  * Copyright 2014, 2018 gijgo.com

dist/modular/js/dialog.js

@@ -1,5 +1,5 @@
 /*
- * Gijgo Draggable v1.9.3
+ * Gijgo Draggable v1.9.4
  * http://gijgo.com/draggable
  *
  * Copyright 2014, 2018 gijgo.com