Setting up a contact or mail form is very easy. The layout of forms is handled centrally, which allows editors to focus on the content of the form.
{
"uid": 252,
"appearance": {
"layout": "default",
"frameClass": "default",
"spaceBefore": "",
"spaceAfter": ""
},
"index": 1,
"id": null,
"link": {
"href": "/content-examples/form-elements/forms?tx_form_formframework%5Baction%5D=perform&tx_form_formframework%5Bcontroller%5D=FormFrontend&cHash=d981f6c98a9d57ca1ee65b83bc1eb26a",
"target": null,
"class": null,
"title": null,
"linkText": "81",
"additionalAttributes": []
},
"form": {
"id": "pwaDemoContactForm-252",
"api": {
"status": null,
"errors": null,
"actionAfterSuccess": null,
"page": {
"current": 0,
"nextPage": null,
"pages": 1
}
},
"i18n": {
"submitButtonLabel": "Submit"
},
"elements": [
{
"properties": {
"text": "* Mandatory fields"
},
"type": "StaticText",
"identifier": "mandatory",
"label": "Your personal data",
"defaultValue": "",
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][mandatory]"
},
{
"type": "GridRow",
"identifier": "gridrow",
"label": "",
"defaultValue": "",
"value": null,
"properties": [],
"elements": [
{
"type": "Fieldset",
"identifier": "fieldset-left",
"label": "",
"properties": {
"gridColumnClassAutoConfiguration": {
"viewPorts": {
"xs": {
"numbersOfColumnsToUse": "12"
},
"sm": {
"numbersOfColumnsToUse": "6"
},
"md": {
"numbersOfColumnsToUse": "6"
},
"lg": {
"numbersOfColumnsToUse": "6"
}
}
}
},
"defaultValue": "",
"value": null,
"elements": [
{
"defaultValue": "",
"type": "Text",
"identifier": "fullname",
"label": "Full name and surname",
"properties": {
"fluidAdditionalAttributes": {
"placeholder": "Full name and surname",
"required": "required",
"autocomplete": "name"
}
},
"validators": [
{
"identifier": "NotEmpty"
}
],
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][fullname]"
},
{
"defaultValue": "",
"type": "Text",
"identifier": "company",
"label": "Company",
"properties": {
"fluidAdditionalAttributes": {
"placeholder": "Company",
"autocomplete": "organization"
}
},
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][company]"
},
{
"defaultValue": "",
"type": "Text",
"identifier": "email",
"label": "Email",
"properties": {
"fluidAdditionalAttributes": {
"placeholder": "Email",
"required": "required",
"autocomplete": "email"
}
},
"validators": [
{
"identifier": "NotEmpty"
},
{
"identifier": "EmailAddress"
}
],
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][email]"
}
]
},
{
"type": "Fieldset",
"identifier": "fieldset-right",
"label": "",
"properties": {
"gridColumnClassAutoConfiguration": {
"viewPorts": {
"xs": {
"numbersOfColumnsToUse": "12"
},
"sm": {
"numbersOfColumnsToUse": "6"
},
"md": {
"numbersOfColumnsToUse": "6"
},
"lg": {
"numbersOfColumnsToUse": "6"
}
}
}
},
"defaultValue": "",
"value": null,
"elements": [
{
"defaultValue": "",
"type": "Text",
"identifier": "subject",
"label": "Subject",
"properties": {
"fluidAdditionalAttributes": {
"placeholder": "Subject",
"required": "required"
}
},
"validators": [
{
"identifier": "NotEmpty"
}
],
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][subject]"
},
{
"defaultValue": "",
"type": "Textarea",
"identifier": "message",
"label": "Message",
"properties": {
"fluidAdditionalAttributes": {
"placeholder": "Message",
"required": "required"
}
},
"validators": [
{
"identifier": "NotEmpty"
}
],
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][message]"
}
]
}
]
},
{
"properties": {
"containerClassAttribute": "input",
"elementClassAttribute": "",
"elementErrorClassAttribute": "error",
"renderAsHiddenField": "",
"styleAttribute": "position:absolute; margin:0 0 0 -999em;"
},
"type": "Honeypot",
"identifier": "Pdg7unHBOrlIw83QzEjkoK",
"label": "",
"defaultValue": "",
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][Pdg7unHBOrlIw83QzEjkoK]"
},
{
"properties": [],
"type": "Hidden",
"identifier": "__currentPage",
"defaultValue": 1,
"label": "",
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][__currentPage]"
},
{
"properties": [],
"type": "Hidden",
"identifier": "__trustedProperties",
"defaultValue": "{\"pwaDemoContactForm-252\":{\"mandatory\":1,\"fullname\":1,\"company\":1,\"email\":1,\"subject\":1,\"message\":1,\"Pdg7unHBOrlIw83QzEjkoK\":1,\"__currentPage\":1}}28cd07867f925da84f52b75d7eab0ca69bd0d411",
"label": "",
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][__trustedProperties]"
},
{
"properties": [],
"type": "Hidden",
"identifier": "__state",
"defaultValue": "TzozOToiVFlQTzNcQ01TXEZvcm1cRG9tYWluXFJ1bnRpbWVcRm9ybVN0YXRlIjoyOntzOjI1OiIAKgBsYXN0RGlzcGxheWVkUGFnZUluZGV4IjtpOjA7czoxMzoiACoAZm9ybVZhbHVlcyI7YTowOnt9fQ==5672da1a4ac4987e351c60be776abeebde641fe8",
"label": "",
"value": null,
"name": "tx_form_formframework[pwaDemoContactForm-252][__state]"
}
]
}
}