Sveltekit form submission request empty

I have a SvelteKit app that displays a list of items. Each item has a ‘delete’ link, that triggers a JavaScript function. This function populates a hidden form element with the id of selected item to delete and submits the form, please see below.

let departmentIdToDelete: string | undefined = undefined

function confirmDelete(id: Number, title: String) {
    if (confirm('Are you sure you want to delete the ' + title + ' department')) {
        const form = document.querySelector('form') as HTMLFormElement
        departmentIdToDelete = id.toString()
        form.submit()
    }
}

And the simple form:

<form method="post" use:enhance>
    <input
        type="hidden"
        name="departmentIdToDelete"
        id="departmentIdToDelete"
        bind:value={departmentIdToDelete}
    />
</form>

When I submit the form, the default form action on the corresponding +page.server.ts receives the event but the request object is empty? The console log is below. Any suggestions as to why this may be the case? Many thanks.

event object = {"cookies":{},"locals":{"auth":{"auth":{"adapter":{},"sessionCookieOption":{"sameSite":"lax","path":"/"},"sessionExpiresIn":{"activePeriod":86400000,"idlePeriod":1209600000},"env":"DEV","hash":{},"autoDatabaseCleanup":true,"csrfProtection":true,"origin":[],"experimental":{"debugMode":false}},"context":{"request":{"url":"http://localhost:5173/departments","method":"POST","headers":{"origin":"http://localhost:5173","cookie":"auth_session=SOME_VALUE"}}},"validatePromise":null,"validateUserPromise":null,"storedSessionId":"SOME_OTHER_VALUE"}},"params":{},"request":{},"route":{"id":"/(admin)/departments"},"url":"http://localhost:5173/departments","isDataRequest":false,"isSubRequest":false}