From: Christian Heller <c.heller@plomlompom.de>
Date: Thu, 6 Feb 2025 11:09:14 +0000 (+0100)
Subject: On edit_structured view, fix inputs reverting on button use.
X-Git-Url: https://plomlompom.com/repos/%7B%7B%20web_path%20%7D%7D/decks/%7B%7B%20deck_id%20%7D%7D/test?a=commitdiff_plain;h=5d2df2ee179ce5696d4756fb999c9ebe749579ed;p=plomledger

On edit_structured view, fix inputs reverting on button use.
---

diff --git a/templates/edit_structured.tmpl b/templates/edit_structured.tmpl
index 9d6273a..46ef79d 100644
--- a/templates/edit_structured.tmpl
+++ b/templates/edit_structured.tmpl
@@ -17,15 +17,50 @@ var dat_lines = {{dat_lines|tojson|safe}};
 {{ macros.taint_js() }}
 
 function update_form() {
+  // catch and empty table
   const table = document.getElementById("dat_lines");
   table.innerHTML = "";
-  function add_button(td, text, disable, f) {
+
+  // basic helpers
+  function add_button(parent_td, label, disabled, onclick) {
+    // add button to td to run onclick (after updating dat_lines from inputs,
+    // and followed by calling taint and update_form
     const btn = document.createElement("button");
-    td.appendChild(btn);
-    btn.textContent = text;
+    parent_td.appendChild(btn);
+    btn.textContent = label;
     btn.type = "button";  // otherwise will act as form submit
-    btn.disabled = disable;
-    btn.onclick = function() {f(); update_form(); taint(); };
+    btn.disabled = disabled;
+    btn.onclick = function() {
+      let n_lines_jumped = 0;
+      for (let i = 0; i < table.rows.length; i++) {
+        const row = table.rows[i];
+        if (row.classList.contains('warning')) {
+          n_lines_jumped++;
+          continue;
+        };
+        for (const input of table.rows[i].querySelectorAll('td input')) {
+          const line_to_update = dat_lines[i - n_lines_jumped];
+          if (input.name.endsWith('comment')) {
+            line_to_update.comment = input.value;
+          } else if (input.name.endsWith('error')) {
+            line_to_update.code = input.value;
+          } else if (input.name.endsWith('date')) {
+            line_to_update.booking_line.date = input.value;
+          } else if (input.name.endsWith('target')) {
+            line_to_update.booking_line.target = input.value;
+          } else if (input.name.endsWith('account')) {
+            line_to_update.booking_line.account = input.value;
+          } else if (input.name.endsWith('amount')) {
+            line_to_update.booking_line.amount = input.value;
+          } else if (input.name.endsWith('currency')) {
+            line_to_update.booking_line.currency = input.value;
+          }
+        }
+      }
+      onclick();
+      taint();
+      update_form();
+    };
   }
   function add_td(tr, colspan=1) {
     const td = document.createElement("td");
@@ -33,10 +68,13 @@ function update_form() {
     td.colSpan = colspan;
     return td;
   }
+
   for (let i = 0; i < dat_lines.length; i++) {
     const dat_line = dat_lines[i];
     const tr = document.createElement("tr");
     table.appendChild(tr);
+
+    // add line inputs
     function setup_input_td(tr, colspan) {
       const td = add_td(tr, colspan);
       if (dat_line.error) { td.classList.add("invalid"); };
@@ -45,7 +83,7 @@ function update_form() {
     function add_input(td, name, value, size) {
       const input = document.createElement("input");
       td.appendChild(input);
-      input.name = `line_${i}_${name}`
+      input.name = `line_${i}_${name}`;
       input.value = value.trim();
       input.size = size;
       input.oninput = taint;
@@ -76,6 +114,7 @@ function update_form() {
       add_td_input('error', dat_line.code, 20, 3)
     }
     add_td_input('comment', dat_line.comment, 40);
+
     // add action buttons, with "delete" after some safety distance
     const td_btns = add_td(tr);
     add_button(td_btns, '^', i > 1 ? false : true, function() {
@@ -90,6 +129,7 @@ function update_form() {
     });
     td_btns.appendChild(document.createTextNode(' · · · '))
     add_button(td_btns, 'delete', false, function() { dat_lines.splice(i, 1); });
+
     // add error explanation row if necessary
     if (dat_line.error) {
       const tr = document.createElement("tr");
@@ -100,6 +140,7 @@ function update_form() {
       tr.classList.add("warning");
     }
   }
+
   // add "add line" row
   const tr = document.createElement("tr");
   table.appendChild(tr);
@@ -108,6 +149,7 @@ function update_form() {
    new_line = {error: '', comment: '', booking_line: {account: '', amount: '', currency: ''}};
    dat_lines.push(new_line);
   });
+
   // make all rows alternate background color for better readability
   Array.from(table.rows).forEach((tr) => {
       tr.classList.add('alternating');