Forms: two forms on same page reacting as single form

[cat-og]

Quick summary

When there are two form blocks on the same post or page will react as though they are part of the same form.

• If they have the same required field names, the form will submit twice, with a confirmation message on both forms.
  

• If they have different field input names, the required fields on the second form will throw an error requiring that you fill that in, even if you were working on the first form
  

To get around this, the user created a single form on their individual posts, with a button that links back to a new page with the second form.

I could not replicate this each time in testing, even if I set up two pages the same way. I set up the same two forms with the same three fields on two different pages; the first page returned this error, and the second page works perfectly.

Steps to reproduce

1. Create a new post or page
2. Add two form blocks with at least one required reply per form, and publish the post
3. Test submitting a form response to the first form

What you expected to happen

The first form submits my response, without any effect on the page's second form.

What actually happened

If the form required field names are the same, a single response will be submitted for both forms.

If the form required field names are different, or if the second form has a required field not included in the first form, the page will return an error requiring you to fill out the required fields on the second form. Neither form is submitted.

Impact

Most (> 50%)

Available workarounds?

Yes, easy to implement

Platform (Simple and/or Atomic)

Simple, Atomic

Logs or notes

No response

[cat-og]

Created a follow-up with user here: 7572279-zd-a8c

[github-actions]

Support References

This comment is automatically generated. Please do not edit it.

• 7572279-zen
• 7989637-zen

[maciejpilarski]

📌 REPRODUCTION RESULTS

– Tested on Atomic – Replicated

📌 FINDINGS/SCREENSHOTS/VIDEO
I was able to reproduce the issue on my side:

📌 ACTIONS

• Triaged

[chekle]

I just wanted to mention that I had a user with the same issue, deleting one of the forms and adding it again solved the problem in that case. 7989637-zd-a8c

[inaikem]

Allocated to the Jetpack Team on The One Board for review.

[simison]

Moved to Jetpack repo.

[lezama]

From an initial exploration, it seems the code expects one form per page, as the post_id is being assigned as the form_id.

[simison]

Should probably use wp_unique_id instead?

Example in Gutenberg.

[simison]

Wow Post ID as form ID goes way back!

If the ID outputs as CSS id="" I bet folks have attached all sorts of styling and custom JS over the years on their sites, so the first form should continue being post ID'ed, methinks.

[lezama]

This got improved by #40998