Using manual form reset inside a component

Attributes
1

Hello,

I have three instances of form reset on a simple div. Two of them are instances of a component, one isn’t. All three are on separate pages.

The component instances are not working.
Does this solution not work inside components, or am I missing something?

Thanks

2

Hey @Darren!

The Form Submit solution using fs-formsubmit-element="reset" does work across multiple component instances, but there are a couple of things worth checking.

First, make sure the core attributes are in place on each instance:

  • fs-formsubmit-element="form" on the Form Block
  • fs-formsubmit-element="reset" on the clickable reset trigger element

The most common issue we see is when multiple form components live on the same page. In that case, you’ll need to add fs-formsubmit-instance to a common parent wrapper for each instance, with a unique value per instance:

fs-formsubmit-instance = "1"
fs-formsubmit-instance = "2"

Without that, the instances can conflict with each other and cause exactly the kind of behavior you’re describing.

A couple of quick questions to help us narrow this down :folded_hands:

  1. On any given page, are you working with one form component or multiple?
  2. Could you share a real staging or published URL where the reset isn’t working? The link in your post looks like it might be a placeholder.

Being able to inspect the live DOM will help us see whether the attributes are being picked up correctly by the script. Once we can see what’s actually rendering, we’ll have a much clearer picture of what’s going on. :flexed_biceps:

3

Thanks very much for your assistance.

  1. On any given page there is only one form component
  2. Here is a real staging link.
4

Hey @Darren

Make sure this script is added site-wide by placing it in site settings

image
image1908×882 39.9 KB

<!-- Finsweet Attributes -->
<script async type="module"
src="https://cdn.jsdelivr.net/npm/@finsweet/attributes@2/attributes.js"
fs-formsubmit
></script>

Here’s the link to the docs

5

Hey Jesse

Thanks for your reply.

That worked.