Now dropdown align option for Select and RemoteSelect components.

4 files changed, 70 insertions, 22 deletions

diff --git a/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemote.kt b/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemote.kt
index 74cb3694..a81d7f2d 100644
--- a/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemote.kt
+++ b/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemote.kt
@@ -116,6 +116,14 @@ open class SelectRemote<T : Any>(
             input.selectWidthType = value
         }
     /**
+     * The dropdown align of the select control.
+     */
+    var dropdownAlign
+        get() = input.dropdownAlign
+        set(value) {
+            input.dropdownAlign = value
+        }
+    /**
      * Determines if an empty option is automatically generated.
      */
     var emptyOption
diff --git a/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemoteInput.kt b/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemoteInput.kt
index af3f1a52..f1643e3d 100644
--- a/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemoteInput.kt
+++ b/kvision-modules/kvision-bootstrap-select-remote/src/main/kotlin/pl/treksoft/kvision/form/select/SelectRemoteInput.kt
@@ -68,29 +68,37 @@ open class SelectRemoteInput<T : Any>(
             q = "{{{q}}}"
         }
         val tempAjaxOptions = ajaxOptions ?: AjaxOptions()
-        this.ajaxOptions = tempAjaxOptions.copy(url = url, preprocessData = {
-            @Suppress("UnsafeCastFromDynamic")
-            JSON.plain.parse(RemoteOption.serializer().list, it.result as String).map {
-                obj {
-                    this.value = it.value
-                    if (it.text != null) this.text = it.text
-                    if (it.className != null) this.`class` = it.className
-                    if (it.disabled) this.disabled = true
-                    if (it.divider) this.divider = true
-                    this.data = obj {
-                        if (it.subtext != null) this.subtext = it.subtext
-                        if (it.icon != null) this.icon = it.icon
-                        if (it.content != null) this.content = it.content
+        this.ajaxOptions = tempAjaxOptions.copy(
+            url = url,
+            preprocessData = {
+                @Suppress("UnsafeCastFromDynamic")
+                JSON.plain.parse(RemoteOption.serializer().list, it.result as String).map {
+                    obj {
+                        this.value = it.value
+                        if (it.text != null) this.text = it.text
+                        if (it.className != null) this.`class` = it.className
+                        if (it.disabled) this.disabled = true
+                        if (it.divider) this.divider = true
+                        this.data = obj {
+                            if (it.subtext != null) this.subtext = it.subtext
+                            if (it.icon != null) this.icon = it.icon
+                            if (it.content != null) this.content = it.content
+                        }
                     }
-                }
-            }.toTypedArray()
-        }, data = data, beforeSend = { _, b ->
-            @Suppress("UnsafeCastFromDynamic")
-            val q = decodeURIComponent(b.data.substring(2))
-            val state = stateFunction?.invoke()
-            b.data = JSON.plain.stringify(JsonRpcRequest(0, url, listOf(q, this.value, state)))
-            true
-        }, httpType = HttpType.valueOf(method.name), cache = false, preserveSelected = true)
+                }.toTypedArray()
+            },
+            data = data,
+            beforeSend = { _, b ->
+                @Suppress("UnsafeCastFromDynamic")
+                val q = decodeURIComponent(b.data.substring(2))
+                val state = stateFunction?.invoke()
+                b.data = JSON.plain.stringify(JsonRpcRequest(0, url, listOf(q, this.value, state)))
+                true
+            },
+            httpType = HttpType.valueOf(method.name),
+            cache = false,
+            preserveSelected = ajaxOptions?.preserveSelected ?: true
+        )
         if (value != null) {
             GlobalScope.launch {
                 val callAgent = CallAgent()
diff --git a/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/Select.kt b/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/Select.kt
index ea98e369..8373dee7 100644
--- a/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/Select.kt
+++ b/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/Select.kt
@@ -135,6 +135,14 @@ open class Select(
             input.selectWidthType = value
         }
     /**
+     * The dropdown align of the select control.
+     */
+    var dropdownAlign
+        get() = input.dropdownAlign
+        set(value) {
+            input.dropdownAlign = value
+        }
+    /**
      * Determines if an empty option is automatically generated.
      */
     var emptyOption
diff --git a/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/SelectInput.kt b/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/SelectInput.kt
index b515ea3e..31ae5125 100644
--- a/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/SelectInput.kt
+++ b/kvision-modules/kvision-bootstrap-select/src/main/kotlin/pl/treksoft/kvision/form/select/SelectInput.kt
@@ -45,6 +45,15 @@ enum class SelectWidthType(internal val value: String) {
 }
 
 /**
+ * Select dropdown align. See [Bootstrap Select width](http://silviomoreto.github.io/bootstrap-select/examples/#width).
+ */
+enum class SelectDropdownAlign {
+    AUTO,
+    LEFT,
+    RIGHT
+}
+
+/**
  * The basic component for Select control.
  *
  * The select control can be populated directly from *options* parameter or manually by adding
@@ -114,6 +123,10 @@ open class SelectInput(
      */
     var selectWidthType: SelectWidthType? by refreshOnUpdate()
     /**
+     * The dropdown align of the select control.
+     */
+    var dropdownAlign by refreshOnUpdate(SelectDropdownAlign.LEFT)
+    /**
      * Determines if an empty option is automatically generated.
      */
     var emptyOption by refreshOnUpdate(false) { setChildrenFromOptions() }
@@ -291,6 +304,15 @@ open class SelectInput(
         } ?: selectWidth?.let {
             sn.add("data-width" to it.asString())
         }
+        when (dropdownAlign) {
+            SelectDropdownAlign.RIGHT -> {
+                sn.add("data-dropdown-align-right" to "true")
+            }
+            SelectDropdownAlign.AUTO -> {
+                sn.add("data-dropdown-align-right" to "auto")
+            }
+            else -> {}
+        }
         return sn
     }
 
@@ -338,6 +360,8 @@ open class SelectInput(
                     getElementJQueryD()?.selectpicker("val", it)
                 }
             } ?: getElementJQueryD()?.selectpicker("val", null)
+        } else if (value == null) {
+            getElementJQueryD()?.selectpicker("val", null)
         }
     }