Required field indicator (*) appears twice
In HTML these field label will be look like
<legend>
<span class="fieldset-legend">Image</span>
</legend>
when we applied a conditional field "required" for image/address fields then Required field indicator (*) appears twice.
In html it looks like
<legend class="form-required">
<span class="fieldset-legend js-form-required form-required">Image</span>
</legend>
| Comment | File | Size | Author |
|---|---|---|---|
| #14 | conditional_fields-fix-duplicate-required-class-3476905-14.patch | 813 bytes | jcandan |
Show commandsStart within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
changes
Comments
Comment #2
kavya n n commentedComment #3
kavya n n commentedComment #4
kavya n n commentedComment #5
kavya n n commentedComment #6
kavya n n commentedComment #7
liquidcms commentedI see the same on a checkbox widget for a List field.
- also fails validation even when something selected
Comment #10
malcomio commentedI wasn't able to reproduce the issue mentioned in #4, but I think the problem is that the JS adds the "form-required" class to the legend and the span inside it.
This change fixes it for me in a subtheme of adminimal_theme
Probably need to check what happens in different themes - are there some themes where the class should go on the legend?
The default behaviour for a required field seems to be that it's on the span: https://git.drupalcode.org/project/drupal/-/blob/11.x/core/themes/claro/...
Also the logic inside that JS file isn't very clear - would be good to review in more detail.
It was added in this commit for #3165898: If target field is multiple checkbox and condition is required then all checkboxes are being required.
Comment #11
benstallings commentedmerge conflicts with 4.x.
Comment #13
jcandan commentedRebased; fixed merge conflict. Also removed the
legends.removeClass('form-required');call.Comment #14
jcandan commentedComment #15
jcandan commentedComment #16
benstallings commentedClaude Code says:
Looks good. The fix is minimal, symmetric (handles both the add and remove paths), and targets the right layer of the DOM. The legendsspan line already applies both js-form-required and form-required, so removing the redundant legends line doesn't lose any functionality.
No concerns — this is a clean, safe two-line deletion. Ready to merge.
Comment #17
joelpittetThanks yes the CSS applies to that class regardless of what it's on so makes sense why it would double up in this case. Thanks for working on this everybody.