svelte-forms-lib
svelte-forms-lib copied to clipboard
support nested json object binding with Form
This will help bind nested JSON object properties (including array properties) to Form. Similar to Felte nested-forms
Example:
export const policySchema: ObjectSchema<Policy> = object({
id: string().defined(),
displayName: string().required(),
description: string().optional(),
subject: object({
id: string().defined().required(),
type: number().required().oneOf([1, 2, 3]),
secondaryId: string().required(),
displayName: string().required(),
})
<Form context={formContext} >
<div class="relative">
<label for="displayName" class={labelClass}>Display Name</label>
<Field type="text" name="displayName" id="displayName" class={inputClass} placeholder="Display Name"/>
<ErrorMessage class={errorClass} name="displayName"/>
</div>
<div>
<label for='subject.secondaryId'>Subject SecondaryId</label>
<Field type="text" name="subject.secondaryId" id="subject.domain" class={inputClass} placeholder="Subject SecondaryId"
disabled={readonly}/>
<ErrorMessage class={errorClass} name="subject.secondaryId"/>
</div>
</Form>