From a5a3504198860b7b2c19d96870e587e2a7cc2822 Mon Sep 17 00:00:00 2001
From: Andreas Tzionis <andy0n7@gmail.com>
Date: Wed, 8 Nov 2023 09:38:23 +0200
Subject: [PATCH] worked on button

---
 lib/client/vanilla/button.tsx | 31 +++++++++++++++++++++++++------
 1 file changed, 25 insertions(+), 6 deletions(-)

diff --git a/lib/client/vanilla/button.tsx b/lib/client/vanilla/button.tsx
index 543bedf2..cd42a72a 100644
--- a/lib/client/vanilla/button.tsx
+++ b/lib/client/vanilla/button.tsx
@@ -52,13 +52,32 @@ const Dialog: React.FC<DialogProps> = ({ open, setOpen, selectedElement }) => {
       selectedElement.setAttribute('type', 'button')
     } else if (type === 'submit') {
       if (submitAsync) {
-        // TODO submit with fetch
-        // selectedElement.setAttribute('onclick', `alert('submit async')`)
-        // selectedElement.setAttribute('type', 'submit')
+        const source = `
+          const form = e.target.closest('form')
+
+          const formData = new FormData()
+          for (let e of form.elements) {
+            if (e.type !== 'submit') {
+              formData.append(e.id, e.type === 'radio' ? e.checked : e.value)
+            }
+          }
+
+          const options = { method: '${submitMethod}', ...('${submitMethod}' !== 'GET' ? { body: formData } : {}), }
+          fetch('${submitUrl}', options)
+            .then((e) => e.text().then((d) => ({ ok: e.ok, text: d })))
+            .then(({ ok, text }) => {
+              alert(ok ? text ?? 'Success' : 'Something went wrong')
+          })
+        `
+        selectedElement.setAttribute('onclick', source)
+        selectedElement.setAttribute('type', 'button')
       } else {
-        // TODO form submit
-        // selectedElement.setAttribute('onclick', `alert('submit')`)
-        // selectedElement.setAttribute('type', 'submit')
+        const source = `
+          const form = e.target.closest('form')
+          form.submit()
+        `
+        selectedElement.setAttribute('onclick', source)
+        selectedElement.setAttribute('type', 'button')
       }
     }
   }