fix: send URL-encoded form data instead of multipart, show errors inline, default empty date to today

2026-05-25 22:26:53 -04:00
parent 930fba369c
commit 14f43a4ae9
2 changed files with 33 additions and 20 deletions
@@ -658,11 +658,13 @@ cookLogJs =
        , "var form = document.getElementById('roux-record-form');"
        , "var dateInput = document.getElementById('roux-record-date');"
        , "var commentInput = document.getElementById('roux-record-comment');"
+        , "var errorEl = document.getElementById('roux-record-error');"
        , "if (!btn || !modal || !form) return;"
        , ""
        , "function showModal() {"
        , "  dateInput.value = new Date().toISOString().slice(0,10);"
        , "  commentInput.value = '';"
+        , "  errorEl.style.display = 'none';"
        , "  modal.style.display = 'block';"
        , "  dateInput.focus();"
        , "}"
@@ -681,20 +683,23 @@ cookLogJs =
        , ""
        , "form.addEventListener('submit', async function(e) {"
        , "  e.preventDefault();"
+        , "  var date = dateInput.value;"
+        , "  var comment = commentInput.value;"
        , "  var filename = btn.dataset.filename;"
-        , "  var fd = new FormData(form);"
+        , "  var body = 'cooked-date=' + encodeURIComponent(date);"
+        , "  if (comment) body += '&comment=' + encodeURIComponent(comment);"
        , "  var res = await fetch('/cook-log/' + encodeURIComponent(filename), {"
        , "    method: 'POST',"
-        , "    body: fd"
+        , "    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },"
+        , "    body: body"
        , "  });"
        , "  if (!res.ok) {"
        , "    var err = await res.json();"
-        , "    alert(err.error || 'Failed to log cooking');"
+        , "    errorEl.textContent = err.error || 'Failed to log cooking';"
+        , "    errorEl.style.display = 'block';"
        , "    return;"
        , "  }"
        , "  hideModal();"
-        , "  var date = fd.get('cooked-date');"
-        , "  var comment = fd.get('comment');"
        , "  var entryDiv = document.createElement('div');"
        , "  entryDiv.style.margin = '0.3rem 0';"
        , "  entryDiv.style.fontSize = '0.9rem';"
@@ -983,6 +988,7 @@ renderRecipe filename recipe entries = do
                H.input ! A.type_ "date" ! A.id "roux-record-date" ! A.name "cooked-date" ! A.required ""
                H.label ! A.for "roux-record-comment" $ "Comment (optional)"
                H.textarea ! A.id "roux-record-comment" ! A.name "comment" ! A.placeholder "How did it go?" ! A.maxlength "500" $ ""
+                H.p ! A.id "roux-record-error" ! A.style "color: var(--roux-accent); font-size: 0.8rem; margin: 0 0 0.5rem; display: none;" $ ""
                H.div ! A.class_ "roux-modal-actions" $ do
                    H.button ! A.type_ "button" ! A.class_ "roux-modal-cancel" ! A.id "roux-modal-cancel" $ "Cancel"
                    H.button ! A.type_ "submit" ! A.class_ "roux-modal-confirm" $ "Log it"