Browse Source

fix: oob swap didn't work with the response structure; used hx-target and hx-swap outerHTML instead and it seems to work

document-upload-removal-layout-update
nic 9 months ago
parent
commit
26886d9b31
  1. 28
      internal/handlers/web/invoices.go
  2. 7
      templates/partials/invoice_card.html

28
internal/handlers/web/invoices.go

@ -386,6 +386,8 @@ func renderSingleInvoiceUpdate(w http.ResponseWriter, invoiceID string, session
originalSearch = r.URL.Query().Get("original_search")
}
log.Printf("Original search term: %s", originalSearch)
// Fetch just the updated invoice
invoice, err := session.GetInvoice(invoiceID)
if err != nil {
@ -400,24 +402,42 @@ func renderSingleInvoiceUpdate(w http.ResponseWriter, invoiceID string, session
return
}
// Log invoice data for debugging
invoiceNumberRaw, hasInvoiceNumber := invoice["invoiceNumber"]
if !hasInvoiceNumber {
log.Printf("WARNING: Invoice does not have invoiceNumber field")
} else {
log.Printf("Invoice number: %v", invoiceNumberRaw)
}
// Format the invoice ID if needed
if id, ok := invoice["id"].(float64); ok {
invoice["id"] = fmt.Sprintf("%.0f", id)
log.Printf("Formatted invoice ID: %s", invoice["id"])
}
// Add status buttons
invoice["buttons"] = getInvoiceStatusButtons(invoice["id"].(string), invoice["status"].(string))
// Add search term and set flag for partial update
// Add search term and set flags for rendering
invoice["SearchTerm"] = originalSearch
invoice["PartialUpdate"] = true
invoice["InvoiceID"] = invoiceID
invoice["MultipleInvoices"] = true // Ensure it renders in the multiple invoice style
// Debug output the structure of the template data
keyCount := 0
for key := range invoice {
keyCount++
log.Printf("Template data key: %s", key)
}
log.Printf("Total template data keys: %d", keyCount)
// Render only the specific invoice card with hx-swap-oob
// Render just the specific invoice card for direct replacement
tmpl := root.WebTemplates
w.Header().Set("Content-Type", "text/html")
err = tmpl.ExecuteTemplate(w, "invoice_card", invoice)
if err != nil {
log.Printf("Error executing template for partial update: %v", err)
http.Error(w, "Internal Server Error", http.StatusInternalServerError)
}
log.Printf("Successfully rendered updated invoice card for %s", invoiceID)
}

7
templates/partials/invoice_card.html

@ -1,5 +1,6 @@
{{define "invoice_card"}}
<div id="invoice-card-{{.invoiceNumber}}" class="invoice-card" {{if .PartialUpdate}}hx-swap-oob="true" {{end}}>
{{$cardID := or .invoiceNumber .id}}
<div id="invoice-card-{{$cardID}}" class="invoice-card">
<div class="invoice-header">
<h4>Invoice #{{.invoiceNumber}}</h4>
<div class="invoice-status {{.status}}">{{.status}}</div>
@ -34,8 +35,8 @@
<div class="button-group">
{{range .buttons}}
<button hx-put="{{.Action}}?partial=true&original_search={{$.SearchTerm}}" hx-confirm="{{.ConfirmText}}"
hx-target="#invoice-search-results" hx-headers='{"X-Original-Search": "{{$.SearchTerm}}"}'
class="compact-button {{.Class}}" title="{{.Label}}" data-status="{{.Status}}">
hx-target="#invoice-card-{{$cardID}}" hx-swap="outerHTML" class="compact-button {{.Class}}"
title="{{.Label}}" data-status="{{.Status}}">
<span class="icon">
{{if eq .Status "draft"}}✏️
{{else if eq .Status "ok"}}🆗

Loading…
Cancel
Save