js/comments.js

@@ -110,23 +110,50 @@ document.addEventListener("DOMContentLoaded", function () {
                     }
                 } else {
                     commentElement.innerHTML = `
-                        <p>
+        <p>
-                            <strong>${escapeHtml(data.author)}</strong>
+            <strong>${escapeHtml(data.author)}</strong>
-                            <span>${escapeHtml(data.created)}</span>
+            <span>${escapeHtml(data.created)}</span>
-                        </p>
+        </p>
-                        <p>${escapeHtml(data.content).replace(/\n/g, "<br>")}</p>
 
-                        <a
+        <p>${escapeHtml(data.content).replace(/\n/g, "<br>")}</p>
-                            href="#comment-form"
-                            class="reply-button"
-                            data-comment-id="${escapeHtml(data.commentId)}"
-                            data-author="${escapeHtml(data.author)}"
-                        >
-                            Antworten
-                        </a>
 
-                        <div class="comment-replies"></div>
+        <form
-                    `;
+            method="post"
+            action="php/controller/deleteComment-controller.php"
+            class="delete-comment-form"
+        >
+            <input
+                type="hidden"
+                name="comment_id"
+                value="${escapeHtml(data.commentId)}"
+            >
+
+            <input
+                type="hidden"
+                name="article_id"
+                value="${escapeHtml(formData.get("article_id"))}"
+            >
+
+            <button
+                type="submit"
+                class="delete-comment-button"
+                onclick="return confirm('Möchtest du diesen Kommentar wirklich löschen?');"
+            >
+                Kommentar löschen
+            </button>
+        </form>
+
+        <a
+            href="#comment-form"
+            class="reply-button"
+            data-comment-id="${escapeHtml(data.commentId)}"
+            data-author="${escapeHtml(data.author)}"
+        >
+            Antworten
+        </a>
+
+        <div class="comment-replies"></div>
+    `;
 
                     commentsList.prepend(commentElement);