Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Forms with multiple pages don't work with Ajax + Snaptcha #2588

@scholejo

Description

@scholejo

Describe the bug

(I guess this is pretty much an edge case: Just wanted to mention it in case someone else stumbles upon this.)

I recently added the Snaptcha Plugin to one of our Client's Websites and enabled the Integration for all Forms. We then saw that our multi page forms don't work anymore. All of them being submitted via Ajax (I did not test if this also applies to forms using page reload.). The first page always gets submitted correctly, but the second page then fails because Snaptcha rejects the POST request. The reason for this is, that on each request the form uses the same value for the snaptcha field. It does not help to add the Snaptcha field to every page because then all of them will be submitted and then only the last one will be evaluated by Snaptcha as it seems.

I then built a little workaround that fetches a new snaptcha value after each submit:

form.addEventListener('onAfterFormieSubmit', (e) => {
  fetch('/actions/snaptcha/field/get-field-value')
    .then(result => { return result.text(); })
    .then(result => {
      const form = e.target;
      form.querySelector('input[name=snaptcha]').value = result;
    });
});

I also had to exclude the summary endpoint from Snaptcha checks in the config/snaptcha.php:

'excludeControllerActions' => [
    'formie/fields/get-summary-html',
],

The forms are rendered via dynamic includes from Blitz, but I don't believe that this has an influence on this issue.

Steps to reproduce

  1. Build a multi page form with Formie
  2. Install and configure Snaptcha
  3. Enable the Snaptcha Integration for your multi page form
  4. In the frontend: submit the first page of your form, which should work
  5. Submit the second page of your form, which should fail with a status 400 error message

Form settings

  • Multi-page form: Yes
  • Submission Method: Ajax
  • Client-side Validation: Yes
  • Custom Form Templates: No

Craft CMS version

4.16.12

Plugin version

2.2.3

Multi-site?

No

Additional context

I also have Blitz installed and am rendering the forms via dynamic includes.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions