Submitting form with disabled field does not send field value

[andonimichael]

Description

When pre-populating a form with data, any disabled form fields are not forwarded to the server in the POST request. This is a common use case e.g. when allowing users to edit their settings or profile, but not allowing them to edit their email address or primary key. Because the disabled field's value is not sent in the request, the schema fails to validate the POST request.

Minimum Reproducible Example

Example use case:

+page.server.ts

userSettings = await getUserSettingsFromDb(...);
const userSettingsForm = await superValidate(userSettings, zod(userSettingsSchema));

+page.svelte

<Form.Field {form} name="email">
    <Form.Control let:attrs>
        <Form.Label>Email</Form.Label>
        <Input {...attrs} bind:value={$formData.email} type="email" disabled />
        <Form.Description>To update your email, please contact support.</Form.Description>
    </Form.Control>
    <Form.FieldErrors />
</Form.Field>

[jjones315]

That is how HTML works, you can add hidden fields for hold the values you don’t want editable, or switch to the json datatype

[andonimichael]

Ah I see this in the dataType docs:

This also means that the disabled attribute, which normally prevents input fields from being submitted, will not have that effect. Everything in $form will be posted when dataType is set to 'json'.

Thank you.