From 68b137c8f92fe14da9551e543ea38214cec141f6 Mon Sep 17 00:00:00 2001
From: Johan Le Baut <johan@helloasso.org>
Date: Sun, 13 Feb 2022 12:54:39 +0100
Subject: [PATCH] add button spinner

---
 templates/landing_form.html | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/templates/landing_form.html b/templates/landing_form.html
index 13b5438..72ea4b0 100644
--- a/templates/landing_form.html
+++ b/templates/landing_form.html
@@ -34,7 +34,7 @@
         <div id="methodPto" class="collapse show testMethods">
 
           <h2 class="text-center form-title">Test d'éligibilité par PTO</h2>
-            <form method="post" action="/test/pto">
+            <form id="formPtoTest" method="post" action="/test/pto">
               <div class="form-group" id="ptoForm">
                 <label class="form-label" for="pto-number">Numéro PTO</label>
                 <input autofocus required type="text" class="form-control" name="pto" id="pto-number" aria-describedby="ptoHelp"
@@ -53,7 +53,7 @@
                   </div>
                 </div>
               </div>
-              <button type="submit" class="btn btn-sable">Tester le PTO</button>
+              <button id="buttonPtoTest" type="submit" class="btn btn-sable">Tester le PTO</button>
             </form>
 
             <br>
@@ -208,10 +208,25 @@
       });
 
       $('#formAddressTest').submit(function(eventObj) {
+        // disable button
+        $("#btnTestAdresse").prop("disabled", true);
+        // add spinner to button
+        $("#btnTestAdresse").html(
+          `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>Test...`
+        );
         $('#formAddressTest').append(`<input type="hidden" class="form-control" name="codeInsee" value="${codeInsee}" />`);
         $('#formAddressTest').append(`<input type="hidden" class="form-control" name="codeRivoli" value="${codeRivoli}" />`);
         return true;
       });
+      $('#formPtoTest').submit(function(eventObj) {
+        // disable button
+        $("#buttonPtoTest").prop("disabled", true);
+        // add spinner to button
+        $("#buttonPtoTest").html(
+          `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>Test...`
+        );
+        return true;
+      });
     });
   </script>
 </body>