frontend/src/routes/persons/[id]/edit/+page.svelte

@@ -42,15 +42,13 @@ const person = $derived(data.person);
 		</div>
 	{/if}
 
-	<form method="POST" use:enhance>
+	<form id="person-edit-form" method="POST" use:enhance>
 		<div class="rounded-sm border border-line bg-surface p-6 shadow-sm">
 			<h2 class="mb-5 text-xs font-bold tracking-widest text-ink-3 uppercase">
 				{m.persons_section_details()}
 			</h2>
 			<PersonEditForm person={person} />
 		</div>
-
-		<PersonEditSaveBar discardHref="/persons/{person.id}" />
 	</form>
 
 	<NameHistoryEditCard
@@ -61,4 +59,6 @@ const person = $derived(data.person);
 	/>
 
 	<PersonDangerZone person={person} form={form} />
+
+	<PersonEditSaveBar discardHref="/persons/{person.id}" formId="person-edit-form" />
 </div>

frontend/src/routes/persons/[id]/edit/PersonEditSaveBar.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 import { m } from '$lib/paraglide/messages.js';
 
-let { discardHref }: { discardHref: string } = $props();
+let { discardHref, formId }: { discardHref: string; formId?: string } = $props();
 </script>
 
 <!-- Sticky full-bleed save bar -->
@@ -13,6 +13,7 @@ let { discardHref }: { discardHref: string } = $props();
 	</a>
 	<button
 		type="submit"
+		form={formId}
 		formaction="?/update"
 		class="rounded bg-primary px-6 py-2 text-sm font-bold tracking-widest text-primary-fg uppercase transition-colors hover:bg-primary/80"
 	>