Surface registration errors with a scroll-to error band by maebeale · Pull Request #1760 · rubyforgood/awbw

maebeale · 2026-06-18T23:32:52Z

Closes [link an issue or remove this line]

What is the goal of this PR and why is this important?

A failed public event registration re-rendered the long form showing only inline per-field errors — easy to miss, and the page didn't move, so it wasn't obvious anything had gone wrong.

How did you approach the change?

On a failed validation, render a red summary band at the top of the form listing each offending field and its message (covers both registration and scholarship fields).
A small form-errors Stimulus controller, attached to the band itself, scrolls it into view on connect — so it only fires when errors are present. Works on both the Turbo (free-event) and full-page (paid-event) submit paths.
Admin-side registration is intentionally untouched (it already shows a top error summary via shared/_errors).

UI Testing Checklist

Submit the public registration form with a required field missing → red band appears at top, page scrolls to it, each bad field is listed.
Submit a valid form → no band, normal success flow.

Anything else to add?

Bumped the Stimulus controller count in AGENTS.md (was stale at 71 → now 74).
Split out of this branch into their own PRs: the "You're registered!" success banner (HOLD: Confirm registrants with a "You're registered!" banner #1764) and graceful handling of over-length answers (Turn over-length registration answers into form errors, not 500s #1763).

maebeale · 2026-06-18T23:33:05Z

+// banner into view so the registrant immediately sees what needs fixing.
+// Attached to the banner itself, so it only connects when errors are present.
+export default class extends Controller {
+  connect() {


🤖 From Claude: Controller is attached to the error banner itself rather than the form, so it only ever connects when errors are present — no guard/target needed, and it scrolls its own element into view.

maebeale · 2026-06-18T23:33:06Z

        flash.now[:alert] = "Payment was cancelled. You are registered for this event but payment may still be due."
      end
+
+      @just_registered = params[:registered].present? || params[:checkout] == "success"


🤖 From Claude: Banner fires for a fresh registration (?registered=true) and for a successful Stripe return (checkout=success), but not on plain ticket re-visits.

jmilljr24 · 2026-06-18T23:35:47Z

@maebeale I think the standard flash message I added is sufficient in another PR. Rudy was happy with the change.

I would want further testing of this changes, no rushing

jmilljr24

I'd like to wait on this.

maebeale · 2026-06-19T00:21:49Z

        Result.new(success?: true, event_registration: event_registration, form_submission: submission, errors: [])
      end
+    rescue ActiveRecord::ValueTooLong => e
+      Result.new(success?: false, event_registration: nil, errors: [ too_long_message(e) ])


🤖 From Claude: ValueTooLong is a StatementInvalid, not a RecordInvalid, so it needs its own rescue — otherwise an answer longer than its varchar(255) column 500s mid-registration instead of re-rendering the form.

maebeale · 2026-06-19T00:44:51Z

@jmilljr24 what do you think about the one-time "You're registered" text? I could move that to another PR.

maebeale · 2026-06-19T00:45:16Z

@jmilljr24 will your error also capture errors on scholarship fields?

maebeale · 2026-06-19T00:46:13Z

@jmilljr24 also there's an extra validation re value is too long that wasn't being handled gracefully. i'd like to deploy that.

jmilljr24 · 2026-06-19T01:04:40Z

I'd like to stick with standard rails flash and avoid extra js.

On second look, I don't see where this is used.

jmilljr24 · 2026-06-19T01:05:31Z


        Result.new(success?: true, event_registration: event_registration, form_submission: submission, errors: [])
      end
+    rescue ActiveRecord::ValueTooLong => e


I haven't seen this but seems worthwhile.

jmilljr24 · 2026-06-19T01:15:00Z

        </div>
      <% end %>

+      <% if @field_errors&.any? %>


I'm not sure how this is different from the flash[:alert] on line 88

Each section was already displaying the correct error for each field.

bc people miss flash messages. there's too much text at top of form to see the field errors, and people aren't realizing the form didn't submit.

jmilljr24 · 2026-06-19T01:16:15Z

  <% end %>
  </div>
 </div>
+<% if @just_registered %>


i think we can get away with sticking with a flash message and not adding any extra variables.

jmilljr24 · 2026-06-19T01:18:57Z

@jmilljr24 what do you think about the one-time "You're registered" text? I could move that to another PR.

Nothing inherently wrong with it but in some ways is redundant to the flash message (standard flow) with additional conditional code. I don't feel its worth it.

A failed public registration re-rendered the long form with only inline per-field errors — easy to miss, and the page didn't move, so it wasn't obvious anything was wrong. Add a summary band at the top of the form listing each offending field, and a small form-errors Stimulus controller (attached to the band) that scrolls it into view on connect. This replaces the generic "scroll down for errors" flash. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

maebeale commented Jun 18, 2026

View reviewed changes

maebeale marked this pull request as ready for review June 18, 2026 23:33

jmilljr24 reviewed Jun 18, 2026

View reviewed changes

maebeale commented Jun 19, 2026

View reviewed changes

jmilljr24 reviewed Jun 19, 2026

View reviewed changes

maebeale mentioned this pull request Jun 19, 2026

Turn over-length registration answers into form errors, not 500s #1763

Open

1 task

maebeale force-pushed the maebeale/form-submission-error-flash branch from 3eef4a5 to aeae193 Compare June 19, 2026 03:51

maebeale changed the title ~~Signal registration submit outcome (error band + auto-scroll, success banner)~~ HOLD: Signal registration submit outcome (error band + auto-scroll, success banner) Jun 19, 2026

maebeale mentioned this pull request Jun 19, 2026

HOLD: Confirm registrants with a "You're registered!" banner #1764

Open

3 tasks

maebeale force-pushed the maebeale/form-submission-error-flash branch from aeae193 to 7e37ea1 Compare June 19, 2026 04:00

maebeale changed the title ~~HOLD: Signal registration submit outcome (error band + auto-scroll, success banner)~~ Surface registration errors with a scroll-to error band Jun 19, 2026

Conversation

maebeale commented Jun 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What is the goal of this PR and why is this important?

How did you approach the change?

UI Testing Checklist

Anything else to add?

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jmilljr24 commented Jun 18, 2026

Uh oh!

jmilljr24 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

maebeale commented Jun 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

maebeale commented Jun 19, 2026

Uh oh!

maebeale commented Jun 19, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jmilljr24 commented Jun 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

maebeale commented Jun 18, 2026 •

edited

Loading

maebeale commented Jun 19, 2026 •

edited

Loading