From 3d5189d9e34a82d83f771277737ba463049a4bcb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Gruszczy=C5=84ski?=
 <mateusz.gruszczynski@firma.interia.pl>
Date: Mon, 10 Mar 2025 23:57:23 +0100
Subject: [PATCH] fix edycji ajax

---
 templates/local_defaults.html | 230 ++++++++++++++++++----------------
 1 file changed, 120 insertions(+), 110 deletions(-)

diff --git a/templates/local_defaults.html b/templates/local_defaults.html
index 5b267c0..feedec8 100644
--- a/templates/local_defaults.html
+++ b/templates/local_defaults.html
@@ -69,117 +69,127 @@
 {% block extra_js %}
 {{ super() }}
 <script>
-document.addEventListener("DOMContentLoaded", function() {
-    // Logika edycji w tabeli
-    document.querySelectorAll(".edit-btn").forEach(button => {
-        button.addEventListener("click", function() {
-            let row = this.closest("tr");
-            let entryId = this.getAttribute("data-id");
-            let ipCell = row.querySelector(".ip-address");
-            let hostnameCell = row.querySelector(".hostname");
-            let saveButton = row.querySelector(".save-btn");
-
-            let ipInput = document.createElement("input");
-            ipInput.type = "text";
-            ipInput.className = "form-control form-control-sm";
-            ipInput.value = ipCell.textContent.trim();
-
-            let hostnameInput = document.createElement("input");
-            hostnameInput.type = "text";
-            hostnameInput.className = "form-control form-control-sm";
-            hostnameInput.value = hostnameCell.textContent.trim();
-
-            ipCell.textContent = "";
-            hostnameCell.textContent = "";
-            ipCell.appendChild(ipInput);
-            hostnameCell.appendChild(hostnameInput);
-
-            this.classList.add("d-none");
-            saveButton.classList.remove("d-none");
-
-            saveButton.addEventListener("click", function() {
-                let newIp = ipInput.value.trim();
-                let newHostname = hostnameInput.value.trim();
-
-                fetch(`/local-defaults/update/${entryId}`, {
-                    method: "POST",
-                    headers: { "Content-Type": "application/json" },
-                    body: JSON.stringify({ ip_address: newIp, hostname: newHostname })
-                })
-                .then(response => response.json())
-                .then(data => {
-                    if (data.status === "success") {
-                        ipCell.textContent = newIp;
-                        hostnameCell.textContent = newHostname;
-
-                        button.classList.remove("d-none");
-                        saveButton.classList.add("d-none");
-                    } else {
-                        alert("Błąd: " + data.message);
-                    }
-                })
-                .catch(error => {
-                    alert("Wystąpił błąd podczas zapisywania: " + error);
-                });
+    document.addEventListener("DOMContentLoaded", function() {
+        // Logika edycji w tabeli
+        document.querySelectorAll(".edit-btn").forEach(button => {
+            button.addEventListener("click", function(event) {
+                event.preventDefault();  // ✅ Zapobiega przeładowaniu strony
+    
+                let row = this.closest("tr");
+                let entryId = this.getAttribute("data-id");
+                let ipCell = row.querySelector(".ip-address");
+                let hostnameCell = row.querySelector(".hostname");
+                let saveButton = row.querySelector(".save-btn");
+    
+                // Jeśli pola edycji już istnieją, nie duplikuj ich
+                if (ipCell.querySelector("input") || hostnameCell.querySelector("input")) {
+                    return;
+                }
+    
+                let ipInput = document.createElement("input");
+                ipInput.type = "text";
+                ipInput.className = "form-control form-control-sm";
+                ipInput.value = ipCell.textContent.trim();
+    
+                let hostnameInput = document.createElement("input");
+                hostnameInput.type = "text";
+                hostnameInput.className = "form-control form-control-sm";
+                hostnameInput.value = hostnameCell.textContent.trim();
+    
+                ipCell.textContent = "";
+                hostnameCell.textContent = "";
+                ipCell.appendChild(ipInput);
+                hostnameCell.appendChild(hostnameInput);
+    
+                this.classList.add("d-none");
+                saveButton.classList.remove("d-none");
+    
+                saveButton.addEventListener("click", function(event) {
+                    event.preventDefault();  // ✅ Zapobiega przeładowaniu strony
+    
+                    let newIp = ipInput.value.trim();
+                    let newHostname = hostnameInput.value.trim();
+    
+                    fetch(`/local-defaults/update/${entryId}`, {
+                        method: "POST",
+                        headers: { "Content-Type": "application/json" },
+                        body: JSON.stringify({ ip_address: newIp, hostname: newHostname })
+                    })
+                    .then(response => response.json())
+                    .then(data => {
+                        if (data.status === "success") {
+                            ipCell.textContent = newIp;
+                            hostnameCell.textContent = newHostname;
+    
+                            button.classList.remove("d-none");
+                            saveButton.classList.add("d-none");
+                        } else {
+                            alert("Błąd: " + data.message);
+                        }
+                    })
+                    .catch(error => {
+                        alert("Wystąpił błąd podczas zapisywania: " + error);
+                    });
+                }, { once: true });  // ✅ Zapobiega dodaniu wielu eventów do przycisku "Zapisz"
+            });
+        });
+    
+        // Logika zaznaczania i usuwania wpisów
+        let deleteButton = document.getElementById("deleteSelectedBtn");
+        let checkboxes = document.querySelectorAll(".entry-checkbox");
+        let selectAllCheckbox = document.getElementById("selectAll");
+    
+        function updateDeleteButtonState() {
+            let anyChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);
+            deleteButton.disabled = !anyChecked;
+        }
+    
+        checkboxes.forEach(checkbox => {
+            checkbox.addEventListener("change", updateDeleteButtonState);
+        });
+    
+        selectAllCheckbox.addEventListener("change", function() {
+            let isChecked = this.checked;
+            checkboxes.forEach(checkbox => checkbox.checked = isChecked);
+            updateDeleteButtonState();
+        });
+    
+        deleteButton.addEventListener("click", function() {
+            let selectedIds = Array.from(checkboxes)
+                                   .filter(checkbox => checkbox.checked)
+                                   .map(checkbox => checkbox.value);
+    
+            if (selectedIds.length === 0) {
+                alert("Nie zaznaczono żadnych wpisów do usunięcia.");
+                return;
+            }
+    
+            if (!confirm("Czy na pewno chcesz usunąć zaznaczone wpisy?")) {
+                return;
+            }
+    
+            fetch("/local-defaults/delete", {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ entry_ids: selectedIds })
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.status === "success") {
+                    selectedIds.forEach(id => {
+                        let row = document.querySelector(`input[value='${id}']`).closest("tr");
+                        row.remove();
+                    });
+                    updateDeleteButtonState();
+                } else {
+                    alert("Błąd: " + data.message);
+                }
+            })
+            .catch(error => {
+                alert("Wystąpił błąd podczas usuwania: " + error);
             });
         });
     });
-
-    // Logika zaznaczania i usuwania wpisów
-    let deleteButton = document.getElementById("deleteSelectedBtn");
-    let checkboxes = document.querySelectorAll(".entry-checkbox");
-    let selectAllCheckbox = document.getElementById("selectAll");
-
-    function updateDeleteButtonState() {
-        let anyChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);
-        deleteButton.disabled = !anyChecked;
-    }
-
-    checkboxes.forEach(checkbox => {
-        checkbox.addEventListener("change", updateDeleteButtonState);
-    });
-
-    selectAllCheckbox.addEventListener("change", function() {
-        let isChecked = this.checked;
-        checkboxes.forEach(checkbox => checkbox.checked = isChecked);
-        updateDeleteButtonState();
-    });
-
-    deleteButton.addEventListener("click", function() {
-        let selectedIds = Array.from(checkboxes)
-                               .filter(checkbox => checkbox.checked)
-                               .map(checkbox => checkbox.value);
-
-        if (selectedIds.length === 0) {
-            alert("Nie zaznaczono żadnych wpisów do usunięcia.");
-            return;
-        }
-
-        if (!confirm("Czy na pewno chcesz usunąć zaznaczone wpisy?")) {
-            return;
-        }
-
-        fetch("/local-defaults/delete", {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify({ entry_ids: selectedIds })
-        })
-        .then(response => response.json())
-        .then(data => {
-            if (data.status === "success") {
-                selectedIds.forEach(id => {
-                    let row = document.querySelector(`input[value='${id}']`).closest("tr");
-                    row.remove();
-                });
-                updateDeleteButtonState();
-            } else {
-                alert("Błąd: " + data.message);
-            }
-        })
-        .catch(error => {
-            alert("Wystąpił błąd podczas usuwania: " + error);
-        });
-    });
-});
-</script>
+    </script>
+    
 {% endblock %}