2 files changed, 37 insertions, 1 deletions
diff --git a/view/html/recipe-edit.html b/view/html/recipe-edit.html
index 7a50905..2513be8 100644
--- a/view/html/recipe-edit.html
+++ b/view/html/recipe-edit.html
@@ -10,7 +10,9 @@
 	</header>
 	<body>
 		<main>
-			<form>
+			<form action="/recipe?method=update">
+				<input type="hidden" name="id" value="{{.Id}}">
+
 				<p>
 					<label>Title</label>
 					<input type="text" name="title" value="{{.Title}}">
@@ -31,10 +33,12 @@
 					<input type="text" name="notes" value="{{.Notes}}">
 				</p>
 
+				<button type="submit">save</button>
 				<a href="/recipe/{{.Id}}"><button type="button">cancel</button></a>
 			</form>
 		</main>
 		{{ template "footer" }}
+		<script src="/static/view/static/ceres.js"></script>
 	</body>
 </html>
 {{end}}
diff --git a/view/static/ceres.js b/view/static/ceres.js
new file mode 100644
index 0000000..acb52a4
--- /dev/null
+++ b/view/static/ceres.js
@@ -0,0 +1,32 @@
+var forms = document.querySelectorAll('form');
+forms.forEach(form => {
+	form.addEventListener('submit', sendFormAsJson);
+});
+
+function sendFormAsJson(event) {
+	event.preventDefault();
+
+	const form = event.target;
+	const url = form.getAttribute('action');
+	const data = new FormData(form);
+	const obj = Object.fromEntries(data.entries());
+
+	fetch(url, {
+		method: 'POST',
+		headers: {'Content-Type': 'application/json'},
+		body: JSON.stringify(obj)
+	})
+	.then(response => {
+		if (response.ok) {
+			console.log('Form submitted successfully');
+		} else {
+			console.error('Form submission failed');
+		}
+		if (response.redirected) {
+			window.location.href = response.url;
+		}
+	})
+	.catch(error => {
+		console.error('Network error:', error);
+	});
+}