Skip to content

[BUGFIX] Fix "not focusable" error on mandatory conditional checkbox groups - #129

Open
kitzberger wants to merge 1 commit into
in2code-de:typo3-v13from
kitzberger:fix-moresteps-checkbox-validation
Open

kitzberger wants to merge 1 commit into
in2code-de:typo3-v13from
kitzberger:fix-moresteps-checkbox-validation

Conversation

@kitzberger

Copy link
Copy Markdown
Contributor

In multi-step forms, a mandatory checkbox group (multiple inputs sharing name="...[]") that is conditionally hidden/shown by powermail_cond triggers a browser console error on submit when the user checks a non-first checkbox:

An invalid form control with name='...' is not focusable.

Two bugs in PowermailConditions.js cause this:

  1. #getFieldByMarker uses querySelector (singular) and returns only the first checkbox of a multi-value group. #hideField/#showField therefore only disable/enable and derequire/rerequire that single checkbox, leaving the rest untouched.

  2. #rerequireField unconditionally restores a native HTML5 "required" attribute, even when the field originally carried powermail's custom "data-powermail-required". Powermail uses data-powermail-required (not native required) for multi-checkbox mandatory fields and handles "at least one checked" via data-powermail-multiple. The native "required" added by #rerequireField is then enforced by reportValidity() on a field inside a display:none fieldset (hidden by the multi-step navigation), which the browser cannot focus.

Fix:

  • #hideField/#showField now iterate querySelectorAll('input, select, textarea') over the wrapping container so every input in a multi-value group is disabled/enabled and derequired/rerequired.
  • #derequireField/#rerequireField bookmark which required attribute was present (native "required" vs "data-powermail-required") and restore the same one, preserving powermail's custom validation for multi- checkbox groups.

Resolves: #128

@mschwemer
mschwemer changed the base branch from master to main September 22, 2026 15:54
@mschwemer
mschwemer changed the base branch from main to typo3-v13 September 22, 2026 15:55
@mschwemer

Copy link
Copy Markdown
Contributor

Hi

Thanks for your contribution. I can confirm the issue. Your changes fix it.

In the meantime (April 1st ... no joke ;-) ) we removed the build stuff and just use plain js. Can you rebase your PR onto the latest typo3-v13 commit and accept all changes from remote.

I did the necessary changes to the file "PowermailCondition.js" and attach it here. Then you only need to copy it to the new location under Resources/Public/JavaScript

PowermailCondition.js

I'd be happy to merge this right away.
I will also forward port it to v14.

…groups

In multi-step forms, a mandatory checkbox group (multiple inputs sharing
name="...[]") that is conditionally hidden/shown by powermail_cond triggers
a browser console error on submit when the user checks a non-first
checkbox:

  An invalid form control with name='...' is not focusable.

Two bugs in PowermailConditions.js cause this:

1. #getFieldByMarker uses querySelector (singular) and returns only the
   first checkbox of a multi-value group. #hideField/#showField therefore
   only disable/enable and derequire/rerequire that single checkbox,
   leaving the rest untouched.

2. #rerequireField unconditionally restores a native HTML5 "required"
   attribute, even when the field originally carried powermail's custom
   "data-powermail-required". Powermail uses data-powermail-required (not
   native required) for multi-checkbox mandatory fields and handles
   "at least one checked" via data-powermail-multiple. The native
   "required" added by #rerequireField is then enforced by
   reportValidity() on a field inside a display:none fieldset (hidden by
   the multi-step navigation), which the browser cannot focus.

Fix:
- #hideField/#showField now iterate querySelectorAll('input, select,
  textarea') over the wrapping container so every input in a multi-value
  group is disabled/enabled and derequired/rerequired.
- #derequireField/#rerequireField bookmark which required attribute was
  present (native "required" vs "data-powermail-required") and restore
  the same one, preserving powermail's custom validation for multi-
  checkbox groups.

Resolves: in2code-de#128
@kitzberger
kitzberger force-pushed the fix-moresteps-checkbox-validation branch from 967e752 to 1add601 Compare September 28, 2026 07:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

"An invalid form control is not focusable" on multi-step forms with mandatory conditional checkbox groups

2 participants