From 52b780428162e1d4decd54b664ccaea221f341ab Mon Sep 17 00:00:00 2001
From: Laetitia Getti <laetitia@hashbang.fr>
Date: Mon, 31 Jul 2023 16:32:31 +0200
Subject: [PATCH] improve total computing on order form

---
 .../order/templates/order/grouped_order_detail.html | 13 +++++--------
 1 file changed, 5 insertions(+), 8 deletions(-)

diff --git a/la_chariotte/order/templates/order/grouped_order_detail.html b/la_chariotte/order/templates/order/grouped_order_detail.html
index 0632781..0d897ef 100644
--- a/la_chariotte/order/templates/order/grouped_order_detail.html
+++ b/la_chariotte/order/templates/order/grouped_order_detail.html
@@ -69,7 +69,7 @@
     <p>Il n'y a pas de produits disponibles dans cette commande !</p>
     {% else %}
     <p class="title">Commander</p>
-    <form method="post" action="{% url 'order:order' grouped_order.id %}">
+    <form id="inputs-parent" method="post" action="{% url 'order:order' grouped_order.id %}">
     
       <!-- Tableau de commandes - sur ordi -->
     <table class="table is-hidden-touch">
@@ -86,7 +86,7 @@
             {% csrf_token %}
           <td>{{ item.name }}</td>
           <td>{{ item.price }} €</td>
-          <td><input name="quantity_{{ item.id }}" onblur="findTotal()" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}></input>
+          <td><input name="quantity_{{ item.id }}" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}></input>
             {% if item.get_remaining_nb is not null %}
             <span class="is-italic mini-title">
             {% if item.get_remaining_nb == 0 %}Produit épuisé
@@ -115,7 +115,7 @@
             <p>{{ item.price }} €</p>
           </div>
           <div class="card-footer-item">
-            <td><input name="quantity_{{ item.id }}" onblur="findTotal()" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}>
+            <td><input name="quantity_{{ item.id }}" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}>
             </input></td>
               {% if item.get_remaining_nb is not null %}
               <span class="is-italic mini-title">
@@ -167,7 +167,7 @@
 <script>
 {% block extra_js %}
 // Compute total price whenever a value in input is modified
-function findTotal(){
+document.getElementById("inputs-parent").addEventListener("change", function() {
   var inputs = document.getElementsByTagName("input");
   total_price = 0;
   for(let input of inputs){
@@ -176,15 +176,12 @@ function findTotal(){
       item_id = input_name.split("_")[1];
       prices = {{ prices_dict | safe }};
       total_price += prices[item_id] * input.value;
-      console.log(prices[item_id] * input.value);
     }
   }
-  console.log(total_price);
-  console.log(document.getElementsByClassName('total'));
   
   [].forEach.call(document.getElementsByClassName('total'), function (el) {
     el.innerHTML = total_price;
   })
-}
+});
 {% endblock %}
 </script>
\ No newline at end of file