Form Submit
Built for

How to use multiple instances

To apply more instances of the solution on the same page, wrap the component inside a parent element with the instance attribute.

Check more examples
How to use multiple instances
example 01
required

Filter Required Minimum setup

example 02

Filter complete setup with all form elements and dynamic content

example 03

Filter complete setup with all form elements and static content

example 04

Filter using checkboxes and active class

example 05

Filter using radio buttons and filter "All"

example 06

Filter Advanced setup with conditional fields

The elements outlined in blue have the necessary attributes for this solution. Toggle X-ray by pressing ? on your keyboard and hover the outlined elements to reveal their attributes.

Instance #1

This is the Instance #1.
Please ensure that your component is inside a parent element with the attribute fs-formsubmit-instance="1".
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
The elements outlined in blue have the necessary attributes for this solution. Toggle X-ray by pressing ? on your keyboard and hover the outlined elements to reveal their attributes.

Instance #2

This is the Instance #2.
Please ensure that your component is inside a parent element with the attribute fs-formsubmit-instance="2".
Please check Success message state to see one more attribute added to the reset button.
Thank you! Your submission has been received!
Reset form
Oops! Something went wrong while submitting the form.