From 9a92d2d3d6840f5444d17fbca9baa00194ed206a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9line=20MS?= <celine@hello-birds.com>
Date: Thu, 9 May 2024 18:30:10 +0200
Subject: [PATCH] Enable submit button on select

---
 itou/static/js/gps.js              | 14 +++++++++++++-
 itou/templates/gps/join_group.html |  4 ++--
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/itou/static/js/gps.js b/itou/static/js/gps.js
index cd8a3dbc80..2c3d3dc3f2 100644
--- a/itou/static/js/gps.js
+++ b/itou/static/js/gps.js
@@ -1,8 +1,9 @@
 htmx.onLoad((target) => {
+    const searchUserInputField = $("#js-search-user-input")
     // Based on static/admin/js/vendor/select2/i18n/fr.js
     // Overriding the noResults text is extraordinary complicated.
     // https://github.com/select2/select2/issues/3799
-    $("#js-search-user-input").select2({
+    searchUserInputField.select2({
         placeholder: 'Jean DUPONT',
         escapeMarkup: function (markup) { return markup; },
         language: {
@@ -42,4 +43,15 @@ htmx.onLoad((target) => {
             }
         }
     });
+    searchUserInputField.on("select2:select", function (e) {
+        const submit_button = $("#join_group_form .btn-primary.disabled");
+        submit_button.attr("disabled", false);
+        submit_button.removeClass("disabled");
+        submit_button.attr("type", "submit"); // hack because button_forms.html don't allow easily to change it.
+    });
+    searchUserInputField.on("select2:unselect", function (e) {
+        const submit_button = $("#join_group_form .btn-primary");
+        submit_button.attr("disabled", true);
+        submit_button.addClass("disabled");
+    });
 });
diff --git a/itou/templates/gps/join_group.html b/itou/templates/gps/join_group.html
index a897789c0a..0ae4deb171 100644
--- a/itou/templates/gps/join_group.html
+++ b/itou/templates/gps/join_group.html
@@ -15,12 +15,12 @@
     <section class="s-box" id="join_group">
         <div class="s-box__container container">
             <div class="c-form">
-                <form method="post" class="js-prevent-multiple-submit">
+                <form method="post" class="js-prevent-multiple-submit" id="join_group_form">
                     {% csrf_token %}
                     {% bootstrap_form_errors form type="all" %}
                     {% bootstrap_field form.user %}
                     {% bootstrap_field form.is_referent %}
-                    {% itou_buttons_form primary_label="Rejoindre le groupe de ce candidat" reset_url=reset_url %}
+                    {% itou_buttons_form primary_label="Rejoindre le groupe de ce candidat" reset_url=reset_url primary_disabled=True %}
                 </form>
             </div>
         </div>