Form Contatti
Form completo: nome, email, select, descrizione, privacy.
Anteprima
Caricamento…
Configurazione
Blocco (config)
{
"blockType": "formDemo",
"viewMode": "Form",
"title": "Contattaci",
"formID": "contact-demo",
"content": [
{
"blockType": "form-control",
"viewMode": "FormControl",
"name": "name",
"label": "Nome",
"slot": "content",
"placeHolder": "Il tuo nome",
"content": [
{
"blockType": "form-label",
"viewMode": "FormLabel",
"slot": "label"
},
{
"blockType": "form-text",
"viewMode": "FormInputText",
"slot": "input"
},
{
"blockType": "form-error",
"viewMode": "FormError",
"slot": "error"
}
]
},
{
"blockType": "form-control",
"viewMode": "FormControl",
"name": "email",
"label": "Email",
"slot": "content",
"placeHolder": "tu@esempio.it",
"content": [
{
"blockType": "form-label",
"viewMode": "FormLabel",
"slot": "label"
},
{
"blockType": "form-text",
"viewMode": "FormInputText",
"slot": "input"
},
{
"blockType": "form-error",
"viewMode": "FormError",
"slot": "error"
}
]
},
{
"blockType": "form-control",
"viewMode": "FormControl",
"name": "subject",
"label": "Argomento",
"slot": "content",
"content": [
{
"blockType": "form-label",
"viewMode": "FormLabel",
"slot": "label"
},
{
"blockType": "form-select",
"viewMode": "FormInputSelect",
"slot": "input",
"options": [
{
"label": "Informazioni",
"value": "info"
},
{
"label": "Supporto",
"value": "support"
},
{
"label": "Collaborazione",
"value": "partnership"
},
{
"label": "Altro",
"value": "other"
}
]
},
{
"blockType": "form-error",
"viewMode": "FormError",
"slot": "error"
}
]
},
{
"blockType": "form-control",
"viewMode": "FormControl",
"name": "message",
"label": "Descrizione",
"slot": "content",
"placeHolder": "Come possiamo aiutarti?",
"content": [
{
"blockType": "form-label",
"viewMode": "FormLabel",
"slot": "label"
},
{
"blockType": "form-text",
"viewMode": "FormInputText",
"slot": "input"
},
{
"blockType": "form-error",
"viewMode": "FormError",
"slot": "error"
}
]
},
{
"blockType": "form-control",
"viewMode": "FormControl",
"name": "privacy",
"label": "Privacy",
"slot": "content",
"content": [
{
"blockType": "form-label",
"viewMode": "FormLabel",
"slot": "label"
},
{
"blockType": "form-checkbox",
"viewMode": "FormInputCheckbox",
"slot": "input",
"options": [
{
"label": "Accetto la privacy policy",
"value": "yes",
"defaultChecked": false
}
]
},
{
"blockType": "form-error",
"viewMode": "FormError",
"slot": "error"
}
]
},
{
"blockType": "action",
"viewMode": "ButtonPrimary",
"slot": "content",
"action": {
"text": "Invia",
"actionType": "submit"
}
}
]
}Come funziona
Un form completo costruito come blocco Form con content = campi. Ogni campo è un form-control che proietta label/input/errore nei suoi slot e riceve i dati (name, label, placeholder) via inheritedData. I campi vivono dentro il FormClientWrapper (FormContext): per questo un campo isolato non renderebbe, un form sì.