From b96a128952f154610f7a3487dc31224a47435bed Mon Sep 17 00:00:00 2001
From: Horilla <support@horilla.com>
Date: Sat, 5 Jul 2025 15:24:55 +0530
Subject: [PATCH] [UPDT] BASE:Prevent duplicate select2 event triggers on HTMX
 updates

---
 .../condition_create_form.html                | 197 ++++++++----------
 .../allocation_request_update_form.html       |  16 +-
 .../htmx/shift_allocation_form.html           |   9 -
 3 files changed, 84 insertions(+), 138 deletions(-)

diff --git a/base/templates/multi_approval_condition/condition_create_form.html b/base/templates/multi_approval_condition/condition_create_form.html
index c23c15b06..25d84e913 100644
--- a/base/templates/multi_approval_condition/condition_create_form.html
+++ b/base/templates/multi_approval_condition/condition_create_form.html
@@ -1,127 +1,94 @@
-{% load i18n %} {% if messages %}
-<div class="oh-wrapper">
-  {% for message in messages %}
-  <div class="oh-alert-container">
-    <div class="oh-alert oh-alert--animated {{message.tags}}">
-      {{ message }}
+{% load i18n %}
+{% if messages %}
+    <div class="oh-wrapper">
+        {% for message in messages %}
+            <div class="oh-alert-container">
+                <div class="oh-alert oh-alert--animated {{message.tags}}">
+                    {{ message }}
+                </div>
+            </div>
+        {% endfor %}
+        <script>
+            setTimeout(function () {
+                $(".oh-modal__close").click();
+            }, 1000);
+        </script>
     </div>
-  </div>
-  {% endfor %}
-  <script>
-    setTimeout(function () {
-      $(".oh-modal__close").click();
-    }, 1000);
-  </script>
-</div>
 {% endif %}
 <div class="oh-modal__dialog-header pb-0">
-  <h2 class="oh-modal__dialog-title" id="objectUpdateModalLabel">
-    {% trans "Multiple Approval Condition" %}
-  </h2>
-  <button
-    class="oh-modal__close"
-    aria-label="Close"
-    {% if messages %}
-      hx-get="{% url 'hx-multiple-approval-condition' %}"
-      hx-target="#multipleApproveCondition"
-    {% endif %}
-  >
-    <ion-icon name="close-outline"></ion-icon>
-  </button>
+    <h2 class="oh-modal__dialog-title" id="objectUpdateModalLabel">
+        {% trans "Multiple Approval Condition" %}
+    </h2>
+    <button class="oh-modal__close" aria-label="Close"
+        {% if messages %}
+            hx-get="{% url 'hx-multiple-approval-condition' %}" hx-target="#multipleApproveCondition"
+        {% endif %}>
+        <ion-icon name="close-outline"></ion-icon>
+    </button>
 </div>
 <div class="oh-modal__dialog-body">
-  <form
-    hx-post="{% url 'multiple-level-approval-create' %}"
-    hx-target="#objectCreateModalTarget"
-    class="oh-profile-section pt-0"
-  >
-    <div class="row">
-      <div class="col-12 col-sm-12 col-md-6 col-lg-6">
-        <div class="oh-input__group">
-          <label class="oh-input__label" for="{{form.department.id_for_label}}"
-            >{% trans "Department" %}</label
-          >
-          {{form.department }} {{form.department.errors }}
+    <form hx-post="{% url 'multiple-level-approval-create' %}" hx-target="#objectCreateModalTarget"
+        class="oh-profile-section pt-0">
+        <div class="row">
+            <div class="col-12 col-sm-12 col-md-6 col-lg-6">
+                <div class="oh-input__group">
+                    <label class="oh-input__label" for="{{form.department.id_for_label}}">
+                        {% trans "Department" %}
+                    </label>
+                    {{ form.department }} {{ form.department.errors }}
+                </div>
+            </div>
+            <div class="col-12 col-sm-12 col-md-6 col-lg-6">
+                <div class="oh-input__group">
+                    <label class="oh-input__label" for="{{form.condition_field.id_for_label}}">
+                        {% trans "Condition Field" %}
+                    </label>
+                    {{ form.condition_field }} {{ form.condition_field.errors }}
+                </div>
+            </div>
         </div>
-      </div>
-      <div class="col-12 col-sm-12 col-md-6 col-lg-6">
-        <div class="oh-input__group">
-          <label
-            class="oh-input__label"
-            for="{{form.condition_field.id_for_label}}"
-            >{% trans "Condition Field" %}</label
-          >
-          {{form.condition_field }} {{form.condition_field.errors}}
+        <div class="row">
+            <div class="col-12 col-sm-12 col-md-6 col-lg-6">
+                <div class="oh-input__group">
+                    <label class="oh-input__label" for="{{ form.condition_operator.id_for_label }}">
+                        {% trans "Condition Operator" %}
+                    </label>
+                    {{ form.condition_operator }} {{ form.condition_operator.errors }}
+                </div>
+            </div>
+            <div class="col-12 col-sm-12 col-md-6 col-lg-6" id="conditionValueDiv">
+                <div class="oh-input__group">
+                    <label class="oh-input__label" for="{{ form.condition_value.id_for_label }}">
+                        {% trans "Condition Value" %}
+                    </label>
+                    {{ form.condition_value }} {{ form.condition_value.errors }}
+                </div>
+            </div>
         </div>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-12 col-sm-12 col-md-6 col-lg-6">
-        <div class="oh-input__group">
-          <label
-            class="oh-input__label"
-            for="{{ form.condition_operator.id_for_label }}"
-          >
-            {% trans "Condition Operator" %}
-          </label>
-          {{ form.condition_operator }} {{ form.condition_operator.errors }}
+        <div class="row">
+            <div class="col-12 col-sm-12 col-md-6 col-lg-6">
+                <div class="oh-input__group">
+                    <label class="oh-input__label" for="{{ form.company_id.id_for_label }}">
+                        {% trans "Company" %}
+                    </label>
+                    {{ form.company_id }} {{ form.company_id.errors }}
+                </div>
+            </div>
         </div>
-      </div>
-      <div class="col-12 col-sm-12 col-md-6 col-lg-6" id="conditionValueDiv">
         <div class="oh-input__group">
-          <label
-            class="oh-input__label"
-            for="{{ form.condition_value.id_for_label }}"
-          >
-            {% trans "Condition Value" %}
-          </label>
-          {{ form.condition_value }} {{ form.condition_value.errors }}
+            <label class="oh-input__label" for="{{ form.multi_approval_manager.id_for_label }}">
+                {% trans "Approval Managers" %}
+            </label>
+            {{ form.multi_approval_manager }} {{ form.multi_approval_manager.errors }}
         </div>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-12 col-sm-12 col-md-6 col-lg-6">
-        <div class="oh-input__group">
-          <label
-            class="oh-input__label"
-            for="{{ form.company_id.id_for_label }}"
-          >
-            {% trans "Company" %}
-          </label>
-          {{ form.company_id }} {{ form.company_id.errors }}
+        <div id="multiApprovalManager_0" class="pt-2" style="text-align: end">
+            <a hx-target="#multiApprovalManager_0" hx-swap="outerHTML" hx-get="{% url 'add-more-approval-managers' %}"
+                role="button" style="color: green">{% trans "Add more managers.." %}</a>
         </div>
-      </div>
-    </div>
-    <div class="oh-input__group">
-      <label
-        class="oh-input__label"
-        for="{{ form.multi_approval_manager.id_for_label }}"
-      >
-        {% trans "Approval Managers" %}
-      </label>
-      {{ form.multi_approval_manager }} {{ form.multi_approval_manager.errors }}
-    </div>
-    <div id="multiApprovalManager_0" class="pt-2" style="text-align: end">
-      <a
-        hx-target="#multiApprovalManager_0"
-        hx-swap="outerHTML"
-        hx-get="{% url 'add-more-approval-managers' %}"
-        role="button"
-        style="color: green"
-        >{% trans "Add more managers.." %}</a
-      >
-    </div>
-    <div class="oh-modal__dialog-footer pb-0" style="padding: 1rem 0.2rem 1rem">
-      <button type="submit" class="oh-btn oh-btn--secondary">
-        {% trans "Apply" %}
-      </button>
-    </div>
-  </form>
+        <div class="oh-modal__dialog-footer pb-0" style="padding: 1rem 0.2rem 1rem">
+            <button type="submit" class="oh-btn oh-btn--secondary">
+                {% trans "Apply" %}
+            </button>
+        </div>
+    </form>
 </div>
-<script>
-  $(document).ready(function () {
-    $("select").on("select2:select", function (e) {
-      $(this).closest("select")[0].dispatchEvent(new Event("change"));
-    });
-  });
-</script>
diff --git a/base/templates/shift_request/allocation_request_update_form.html b/base/templates/shift_request/allocation_request_update_form.html
index 6ca83f6fa..f404bfabe 100644
--- a/base/templates/shift_request/allocation_request_update_form.html
+++ b/base/templates/shift_request/allocation_request_update_form.html
@@ -1,16 +1,4 @@
 {% load i18n %} {% load static %}
-<form
-  hx-post="{% url 'shift-allocation-request-update' form.instance.id %}"
-  hx-target="#shiftRequestModalUpdateBody"
->
-  {{form.as_p}}
+<form hx-post="{% url 'shift-allocation-request-update' form.instance.id %}" hx-target="#shiftRequestModalUpdateBody">
+    {{form.as_p}}
 </form>
-
-<script>
-  $(document).ready(function () {
-    $("select").on("select2:select", function (e) {
-      $(".leave-message").hide();
-      $(this).closest("select")[0].dispatchEvent(new Event("change"));
-    });
-  });
-</script>
diff --git a/base/templates/shift_request/htmx/shift_allocation_form.html b/base/templates/shift_request/htmx/shift_allocation_form.html
index d4f3e8e52..e7e70b86d 100644
--- a/base/templates/shift_request/htmx/shift_allocation_form.html
+++ b/base/templates/shift_request/htmx/shift_allocation_form.html
@@ -24,12 +24,3 @@
     {{form.as_p}}
   </form>
 </div>
-
-<script>
-  $(document).ready(function () {
-    $("select").on("select2:select", function (e) {
-      $(".leave-message").hide()
-      $(this).closest("select")[0].dispatchEvent(new Event("change"));
-    });
-  });
-</script>