Ajout d'un nouveau transfert si formulaire rempli

kfet/templates/kfet/transfers_create.html

@@ -20,7 +20,7 @@
     --><button type="submit" id="submit" class="btn btn-primary btn-lg">Enregistrer</button>
     {{ transfer_formset.management_form }}
   </div>
-  <table class="transfer_formset table">
+  <table class="transfer_formset table" id="transfer_formset">
     <thead>
       <tr>
         <td></td>
@@ -52,6 +52,7 @@
 
 <script type="text/javascript">
 $(document).ready(function () {
+
     function getAccountData(trigramme, callback = function() {}) {
         $.ajax({
             dataType: "json",
@@ -75,7 +76,12 @@ $(document).ready(function () {
             getAccountData(trigramme, function(data) {
                 $input_id.val(data.id);
                 $data.text(data.name);
-                $next.focus();
+                if (!$next.length) {
+                  new_row = add_form();
+                  new_row.find(".from_acc input").focus();
+                } else {
+                  $next.focus();
+                }
             });
         } else {
             $input_id.val('');
@@ -83,9 +89,10 @@ $(document).ready(function () {
         }
     }
 
-    $('.input_from_acc, .input_to_acc').on('input', function() {
-        var tri = $(this).val().toUpperCase();
-        updateAccountData(tri, $(this));
+    $(document).on("input", '.input_from_acc, .input_to_acc', function(e) {
+        var target = $(e.target)
+        var tri = target.val().toUpperCase();
+        updateAccountData(tri, target);
     });
 
     $('#transfers_form').on('submit', function(e) {
@@ -101,7 +108,6 @@ $(document).ready(function () {
             method  : "POST",
             data    : data,
             beforeSend: function ($xhr) {
-                $xhr.setRequestHeader("X-CSRFToken", csrftoken);
                 if (password != '')
                     $xhr.setRequestHeader("KFetPassword", password);
             },
@@ -118,6 +124,36 @@ $(document).ready(function () {
             }
         });
     }
+
+    function add_form() {
+      var row_template = `
+      <tr class="transfer_form" id="{{ transfer_formset.empty_form.prefix }}">
+        <td class="from_acc_data"></td>
+        <td class="from_acc">
+          <input type="text" name="from_acc" class="input_from_acc" maxlength="3" autocomplete="off" spellcheck="false">
+          {{ transfer_formset.empty_form.from_acc }}
+        </td>
+        <td class="amount">{{ transfer_formset.empty_form.amount }}</td>
+        <td class="to_acc">
+          <input type="text" name="to_acc" class="input_to_acc" maxlength="3" autocomplete="off" spellcheck="false">
+          {{ transfer_formset.empty_form.to_acc }}
+        </td>
+        <td class="to_acc_data"></td>
+      </tr>`;
+      last_row = $("#transfer_formset tr:last")
+
+      // L'id de chaque form ressemble à `form-<id>`
+      num_rows = parseInt(last_row.attr("id").split("-")[1]);
+
+      new_row = $(row_template.replace(/__prefix__/g, num_rows + 1))
+      last_row.after(new_row)
+      // On incrémente le nombre de formsets dans la form globale
+      $("#id_form-TOTAL_FORMS").val(function(i, oldval) {
+        return ++oldval ;
+      });
+
+      return new_row
+    }
 });
 </script>