On utilise un seul modal pour supprimer des votes

elections/templates/elections/election_voters.html

@@ -2,6 +2,27 @@
 {% load i18n %}
 
 
+{% block extra_head %}
+<script>
+  document.addEventListener('DOMContentLoaded', () => {
+    const $del_modal = document.getElementById('modal-delete');
+    const $del_title = $del_modal.querySelector('.modal-card-title');
+    const $del_form = $del_modal.querySelector('form');
+
+    $del_buttons = document.querySelectorAll('.modal-button.delete-vote')
+
+    $del_buttons.forEach($del => {
+      $del.addEventListener('click', () => {
+        $del_form.action = $del.dataset['post_url'];
+        $del_title.innerHTML = $del.dataset['tooltip'];
+      });
+    });
+  });
+
+</script>
+
+{% endblock %}
+
 {% block content %}
 
 <div class="level">
@@ -48,6 +69,10 @@
 
 <div class="columns is-centered">
   <div class="column is-two-thirds">
+    {% if can_delete %}
+    {% include "forms/modal-form.html" with modal_id="delete" form=d_form %}
+    {% endif %}
+
     <table class="table is-striped is-fullwidth">
       <thead>
         <tr>
@@ -85,19 +110,18 @@
           </td>
           {% if can_delete %}
           <td class="has-text-centered">
-            {% url 'election.delete-vote' election.pk v.pk forloop.counter as post_url %}
-            {% blocktrans with v_name=v.full_name asvar modal_title %}Supprimer le vote de {{ v_name }}{% endblocktrans %}
-            <a class="tag is-danger has-tooltip-primary modal-button" data-target="modal-{{ forloop.counter }}" data-tooltip="{{ modal_title }}">
+            {% blocktrans with v_name=v.full_name asvar v_delete %}Supprimer le vote de {{ v_name }}{% endblocktrans %}
+            <a class="tag is-danger has-tooltip-primary modal-button delete-vote" data-target="modal-delete" data-tooltip="{{ v_delete }}" data-post_url="{% url 'election.delete-vote' election.pk v.pk forloop.counter %}">
               <span class="icon">
                 <i class="fas fa-user-minus"></i>
               </span>
             </a>
-            {% include "forms/modal-form.html" with modal_id=forloop.counter form=v.form %}
             {% endif %}
         </tr>
         {% endfor %}
         {% endif %}
     </table>
+
   </div>
 </div>
 

elections/views.py

@@ -479,9 +479,7 @@ class ElectionVotersView(NotArchivedMixin, DetailView):
                 and not election.tallied
             )
             if can_delete:
-                # On rajoute le formulaire pour supprimer le vote
-                for v in voters:
-                    v.form = DeleteVoteForm()
+                context["d_form"] = DeleteVoteForm()
 
             context["can_delete"] = can_delete
         context["voters"] = voters

shared/templates/forms/select.html

@@ -4,8 +4,8 @@
   {{ field.label_tag }}
 </label>
 
-<div class="control">
-  <span class="select{% if field|is_multiple_select %} is-multiple{% endif %}{% if field.errors|length > 0 %} is-danger{% endif %}">
+<div class="control is-expanded">
+  <span class="select is-fullwidth{% if field|is_multiple_select %} is-multiple{% endif %}{% if field.errors|length > 0 %} is-danger{% endif %}">
     {{ field }}
   </span>