From 52888b3af73da3743e2db3f0370d9db892cbde8a Mon Sep 17 00:00:00 2001
From: Pierre Hubert <pierre.git@communiquons.org>
Date: Thu, 7 Apr 2022 18:17:58 +0200
Subject: [PATCH] Automatically join services into single input field on submit

---
 templates/settings/edit_user.html | 31 ++++++++++++++++++++++++-------
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/templates/settings/edit_user.html b/templates/settings/edit_user.html
index 2f166c6..7eb69e4 100644
--- a/templates/settings/edit_user.html
+++ b/templates/settings/edit_user.html
@@ -1,7 +1,7 @@
 {% extends "base_settings_page.html" %}
 {% block content %}
 
-<form method="post" target="/admin/users">
+<form method="post" action="/admin/users" id="edit_user_form">
     <!-- User ID -->
     <div class="form-group">
         <label class="form-label mt-4" for="userID">User ID</label>
@@ -11,7 +11,7 @@
 
     <!-- User name -->
     <div class="form-group">
-        <label class="form-label mt-4" for="username">User name</label>
+        <label class="form-label mt-4" for="username">Username</label>
         <input class="form-control" id="username" type="text"
                name="username" value="{{ u.username }}" required/>
         <div class="valid-feedback">This username is valid</div>
@@ -73,23 +73,24 @@
         <legend class="mt-4">Granted clients</legend>
         <div class="form-check">
             <label class="form-check-label">
-                <input type="radio" class="form-check-input" name="granted_clients"
+                <input type="radio" class="form-check-input" name="grant_type"
                        value="all_clients" {% if u.authorized_clients== None %} checked="" {% endif %}>
                 Grant all clients
             </label>
         </div>
         <div class="form-check">
             <label class="form-check-label">
-                <input type="radio" class="form-check-input" name="granted_clients"
+                <input type="radio" class="form-check-input" name="grant_type"
                        value="custom_clients" {% if u.authorized_clients !=None %} checked="checked" {% endif %}>
                 Manually specify allowed clients
             </label>
         </div>
 
         <div id="clients_target">
+            <input type="hidden" name="granted_clients" value=""/>
             {% for c in clients %}
             <div class="form-check">
-                <input class="form-check-input" type="checkbox" class="authorize_client" data-id="{{ c.id.0 }}"
+                <input class="form-check-input authorize_client_checkbox" type="checkbox" data-id="{{ c.id.0 }}"
                        {% if u.can_access_app(c.id) %} checked="" {% endif %}>
                 <label class="form-check-label" for="admin">
                     {{ c.name }}
@@ -98,6 +99,8 @@
             {% endfor %}
         </div>
     </fieldset>
+
+    <input type="submit" class="btn btn-primary mt-4" value="{{ page_title }}">
 </form>
 
 <script>
@@ -137,7 +140,7 @@
     // Clients granted
     function refreshDisplayAuthorizedClients() {
         const clientsSelectorEl = document.getElementById("clients_target");
-        const radioBtn = document.querySelector("input[name=granted_clients][value=custom_clients]");
+        const radioBtn = document.querySelector("input[name=grant_type][value=custom_clients]");
         clientsSelectorEl.style.display = radioBtn.checked ? "block" : "none";
     }
     refreshDisplayAuthorizedClients();
@@ -146,7 +149,21 @@
     })
 
 
+    // Handle submitted form
+    const form = document.getElementById("edit_user_form");
+    form.addEventListener("submit", (ev) => {
+        ev.preventDefault();
+
+        const authorized_clients = [...document.querySelectorAll(".authorize_client_checkbox")]
+            .filter(e => e.checked)
+            .map(e => e.getAttribute("data-id")).join(",")
+
+        document.querySelector("input[name=granted_clients]").value = authorized_clients;
+
+        form.submit();
+    });
 
 
 </script>
-{% endblock content %}
+
+{% endblock content %}
\ No newline at end of file