Quantcast
Channel: Active questions tagged svelte - Stack Overflow
Viewing all articles
Browse latest Browse all 1545

Checkbox missing in form data when using SvelteKit Superforms with Zod

$
0
0

I am trying to build a form using SvelteKit Actions, Superforms, Formsnap and Zod. But my checkbox is not working as expected.

// schema.tsexport const formSchema = z.object({    ...    private: z.boolean().default(true),    ...});
<!-- +page.svelte --><script lang="ts">    ...    export let data: PageData;    const form = superForm(data.form, {        validators: zodClient(formSchema),    });    const { enhance, form: formData, errors, submitting } = form;   ...</script>...<Form.Field {form} name="private"><Form.Control let:attrs><Form.Label>Private</Form.Label><Checkbox {...attrs} bind:checked={$formData.private} /></Form.Control></Form.Field>...

On the client, things seem to work as expected (the value in the SuperDebug component and a variable updates the value correctly), but when the form is submitted the private field is missing in the form data (observed in the onSubmit event and on the server). This means that on the server the value is always set to false (as it is missing).

I have tried using an <input type="checkbox" /> instead of the custom <Checkbox /> component, but the problem persists. It seems to be an issue when submitting the form.

Why is this happening? This setup seems like it should work, and it does for all my other (text) form fields.


Viewing all articles
Browse latest Browse all 1545

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>