Skip to content

feat: Bring CAPTCHA validation feedback in line with main donate form

stephen requested to merge improve-newsletter-captcha-error-display into main

The standalone newsletter signup form is simple by design; however, the experience of bumping into the backend form validation is perhaps a little too simple, especially when compared with the Bootstrap-style validation provided by the larger and more complex donation form. This MR seeks to bring that experience in line with the mainstay form by implementing the AJAX CAPTCHA pre-submission validation layer utilized by the main donation form.

  • tordonate.civicrm.views sees SubscriptionForm expanded with a new internal method, validate_captcha(), which accepts an HTTPRequest containing the form data and validates it on the fly, returning a JSON string of errors if any are found, and processing the subscription request if none are.
  • tordonate.civicrm.urls adds a route for this new method for the front end to leverage.
  • script.js adds a handler for the subscription form's submit action, circumventing the native form behavior (to prevent a race condition between the near-instantaneous processing native HTML will perform and the slightly-slower Fetch API call and response which would validate the CAPTCHA). Errors with the form are painted onto the UI; if no errors were present, the user is forwarded to the /subscribed/ page.
  • Users with Javascript disabled will not experience any changes, and can continue using the form as normal.

Fixes #120.

Edited by stephen

Merge request reports

Loading