Browser Validation with Required Attribute
A guide to browser validation on fields using the required attribute. If you prefer to have the browser validate that a required field contains a value, there is an automated way to do this with the Template Overides feature.
Instructions
In previous versions of Freeform, there was a parameter to control this (useRequiredAttribute), but that is no longer available.
To apply a required attribute to all fields that are marked as required in the form builder, you can access it with ":required" via the fields namespace in the Template Overides feature.
A barebones example (without any other overrides in place) would look something like this:
{{ form.render({
fields: {
":required": {
attributes: {
label: { "+class": "label-required" },
input: { "required": true },
},
},
}
}) }}
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10