FormCheck

Easily validate forms using HTML attributes. Create custom validation rules for your Webflow forms without needing extra code.

Copy the FormCheck <script> and paste into the <head> of your page

<!-- [WebTricks by CodeRaccoons] - FormCheckĀ -->
<script async src="https://cdn.jsdelivr.net/gh/TheCodeRaccoons/WebTricks@1/" ></script>
Copy Script

Required attributes

Optional
Defines the form element to validate.
Attribute to add
Name
wt-formcheck-element
Value
form
Instructions

Assign this attribute to the form element to enable validation.

How does it look?
Optional
Defines the class applied to invalid fields.
Attribute to add
Name
wt-formcheck-class
Value
Instructions

Set this attribute to style invalid fields with a custom class.

How does it look?
Optional
Defines the reset button for the form.
Attribute to add
Name
wt-formcheck-element
Value
reset
Instructions

Assign this attribute to a button to clear form inputs and errors.

How does it look?
Optional
Defines elements to display error messages for invalid fields.
Attribute to add
Name
wt-formcheck-type
Value
error
Instructions

Assign this attribute to elements that will display error messages.

How does it look?
Optional
Defines the submit button within the form.
Attribute to add
Name
wt-formcheck-type
Value
submit
Instructions

Assign this attribute to the form's submit button.

How does it look?
Optional
Defines fields that are required for submission.
Attribute to add
Name
wt-formcheck-type
Value
required
Instructions

Assign this attribute to input fields that must be filled before form submission.

How does it look?
Optional
Defines the default submit button within the form.
Attribute to add
Name
wt-formcheck-element
Value
default-submit
Instructions

Assign this attribute to the form's default submit button.

How does it look?
Optional
Defines the message displayed on the submit button after validation.
Attribute to add
Name
wt-formcheck-message
Value
Instructions

Set this attribute to customize the submit button text after validation.

How does it look?

Optional Attributes

No items found.

Working examples

See the Pen WT - FormCheck by Code Raccoons (@jorchie) on CodePen.