fix: Handles forms that was on change

fixes #38
PHACDataHub · May 15, 2023 · 9c246fc · 9c246fc
1 parent cfdd972
commit 9c246fc
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 0 deletions.
diff --git a/autocomplete/static/autocomplete/js/autocomplete.js b/autocomplete/static/autocomplete/js/autocomplete.js
@@ -1,3 +1,10 @@
+function phac_aspc_autocomplete_trigger_change(container_id) {
+    setTimeout(() => {
+        const container = document.getElementById(container_id);
+        const el = container.querySelector('.textinput');
+        el.dispatchEvent(new Event('change', { bubbles: true }));
+    }, 0)
+}
 
 function phac_aspc_autocomplete_clear_focus(container, activate_ring) {
     const hasFocus = container.querySelectorAll('.hasFocus'); 

diff --git a/autocomplete/templates/autocomplete/component.html b/autocomplete/templates/autocomplete/component.html
@@ -7,7 +7,9 @@
   <div
     id="{{ component_id }}__container"
     class="phac_aspc_form_autocomplete"
+    {% if htmx_preserve %}
     hx-preserve
+    {% endif %}
   >
     {% comment %} Hidden input elements used to maintain the component's state {% endcomment %}
     {% comment %} and used when submitting forms {% endcomment %}

diff --git a/autocomplete/templates/autocomplete/item.html b/autocomplete/templates/autocomplete/item.html
@@ -70,4 +70,8 @@
             {% endif %}
         {% endfor %}
     {% endif %}
+    <script data-componentid="{{ component_id }}">
+        phac_aspc_autocomplete_trigger_change(document.currentScript.dataset.componentid + '__container');
+    </script>
+
 {% endif %}