fixes in KMP done first in AMP

Ansteorra · Sep 6, 2024 · 8cd1c41 · 8cd1c41
1 parent 37be253
commit 8cd1c41
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 7 deletions.
diff --git a/app/assets/js/controllers/auto-complete-controller.js b/app/assets/js/controllers/auto-complete-controller.js
@@ -146,7 +146,7 @@ class AutoComplete extends Controller {
 
     initSelectionValueChanged() {
         if (this._datalistLoaded) {
-            if (this.initSelectionValue == null) {
+            if (this.initSelectionValue == null || !this.initSelectionValue.hasOwnProperty("value")) {
                 return;
             }
             let newOption = this.initSelectionValue;
@@ -166,8 +166,11 @@ class AutoComplete extends Controller {
                 this.value = newOption.value;
             }
         } else {
-            this.hiddenTarget.value = this.initSelectionValue.value;
-            this.inputTarget.value = this.initSelectionValue.text;
+            //check if there is a value key in the initSelectionValue object
+            if (this.initSelectionValue.hasOwnProperty("value")) {
+                this.hiddenTarget.value = this.initSelectionValue.value;
+                this.inputTarget.value = this.initSelectionValue.text;
+            }
         }
     }
 
@@ -429,9 +432,14 @@ class AutoComplete extends Controller {
                         }
                         itemHtml.setAttribute("role", "option")
                         itemHtml.setAttribute("aria-selected", "false")
-                        itemHtml.textContent = item.text;
+
                         //add a span around matching string to highlight it
-                        itemHtml.innerHTML = itemHtml.innerHTML.replace(new RegExp(query, 'gi'), match => `<span class="text-primary">${match}</span>`);
+                        if (query != "") {
+                            let filteredOptions = item.text;
+                            itemHtml.innerHTML = filteredOptions.replace(new RegExp(query, 'gi'), match => `<span class="text-primary">${match}</span>`);
+                        } else {
+                            itemHtml.innerHTML = item.text;
+                        }
                         this.resultsTarget.appendChild(itemHtml);
                     }
                 }

diff --git a/app/src/View/Helper/KmpHelper.php b/app/src/View/Helper/KmpHelper.php
@@ -101,7 +101,7 @@ public function comboBoxControl($Form, $inputField, $resultField, $data, $label,
             "data-ac-target" => "input",
             "container" => ["style" => "margin:0 !important;",]
         ]);
-        echo "<ul data-ac-target='results' class='list-group z-3 col-12 position-absolute auto-complete-list'></ul></div>";
+        echo "<ul data-ac-target='results' class='list-group z-3 col-12 position-absolute auto-complete-list' hidden='hidden' ></ul></div>";
     }
 
     public function autoCompleteControl($Form, $inputField, $resultField, $url, $label, $required, $allowOtherValues, $minLength, $additionalAttrs,)
@@ -126,7 +126,7 @@ public function autoCompleteControl($Form, $inputField, $resultField, $url, $lab
             "data-ac-target" => "input",
             "container" => ["style" => "margin:0 !important;",]
         ]);
-        echo "<ul data-ac-target='results' class='list-group z-3 col-12 position-absolute auto-complete-list'></ul></div>";
+        echo "<ul data-ac-target='results' class='list-group z-3 col-12 position-absolute auto-complete-list' hidden='hidden' ></ul></div>";
     }
     /**
      * Returns a boolean icon