Delete button works now.

packetserver/http/templates/job_detail.html

@@ -5,7 +5,7 @@
 {% block content %}
 <h2>Job #{{ job.id }}</h2>
 
-<!-- New: Action buttons (Back + Delete) -->
+<!-- Action buttons (Back + Delete) -->
 <div class="mb-4 d-flex justify-content-between align-items-center">
   <a href="/jobs" class="btn btn-outline-secondary">← Back to Jobs</a>
 
@@ -38,17 +38,17 @@
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+
+        <!-- Plain form that POSTs with _method=DELETE -->
+        <form action="/api/v1/jobs/{{ job.id }}" method="post" style="display: inline;">
+          <input type="hidden" name="_method" value="DELETE">
         <button
           type="button"
           class="btn btn-danger"
-          hx-delete="/api/v1/jobs/{{ job.id }}"
+          onclick="deleteJob({{ job.id }})">
-          hx-target="body"
-          hx-swap="innerHTML"
-          hx-push-url="true"
-          data-bs-dismiss="modal"
-          hx-on::after-request="if(event.detail.successful) document.body.innerHTML = '<div class=container mt-5><div class=alert alert-success text-center><h4>Job {{ job.id }} deleted successfully.</h4><a href=/dashboard/jobs class=btn btn-primary mt-3>Back to Jobs</a></div></div>'">
           Yes, Delete Permanently
         </button>
+        </form>
       </div>
     </div>
   </div>
@@ -180,4 +180,29 @@
     </div>
 </div>
 
+<script>
+async function deleteJob(jobId) {
+  if (!confirm('Really delete Job #' + jobId + ' permanently? This cannot be undone.')) return;
+
+  try {
+    const response = await fetch(`/api/v1/jobs/${jobId}`, {
+      method: 'DELETE',
+      credentials: 'include'  // For auth cookies
+    });
+
+    if (response.ok) {
+      alert('Job deleted successfully!');
+      window.location.href = '/jobs';
+    } else {
+      const error = await response.json();
+      alert('Failed to delete: ' + (error.detail || 'Unknown error'));
+    }
+  } catch (err) {
+    console.error(err);
+    alert('Network error during delete');
+  }
+}
+</script>
+
+
 {% endblock %}