I have a form where there's a listbox with some options. I also have a couple fieldsets which are shown depending on the listbox options selected. From there, each fieldset has fields, one of which is another listbox. A certain selection in that listbox can hide another field next to it.
Example (all required):
Listbox1 (Option 1, Option 2)
Fieldset1 [conditional: shown if listbox is Option 1]
- ListboxA (Option A, Option B, Option C)
- Textfield [conditional: hidden if ListboxA is Option B]
Fieldset2 [conditional: shown if listbox is Option 2]
- Textarea
When I do nothing but submit the form, my Chrome error console says:
"An invalid form control with name='submitted[fieldset1][textfield]' is not focusable."
So when I make an actual selection of Option 2 and fill in Textarea, it still says that textfield is not focusable.
Comment | File | Size | Author |
---|---|---|---|
webform_conditionals.png | 26.22 KB | joshuasosa | |
webform_components.png | 16.08 KB | joshuasosa |
Comments
Comment #2
joshuasosa CreditAttribution: joshuasosa commentedComment #3
sbs_tedbalog CreditAttribution: sbs_tedbalog commentedI would like to report that I'm experiencing the same issue. It seems if an element is hidden by multiple conditions (say, two select options) that Chrome chokes when validating the form. When inspecting the output, the working form has a class of "form-text required webform-conditional-disabled" as well as a disabled tag on the input textbox. The non-working form is missing any and all class entries as well as the disabled tag. This is likely why Chrome is trying to process the field because it is not showing as disabled.
Comment #4
leymannxAh yes, thanks for the "disabled" hint. Conditionally setting the element to "disabled" via states when it's not needed fixes the issue.
Comment #5
Liam MorlandDoes this need some changes to documentation?
Comment #6
joshuasosa CreditAttribution: joshuasosa commentedThis issue might have been resolved at some point. When I try my example use case now with 4.23, I don't get the error and the form submits successfully. The class webform-conditional-disabled and attribute 'disabled' appears on my textfield in Fieldset 1. So it could be closed (outdated) unless someone still has the issue.
Comment #7
Liam MorlandThanks
Comment #8
Chris Matthews CreditAttribution: Chris Matthews commentedI just ran into this issue on Drupal core 8.9.13 and Webform 6.0.0 using the "Advanced address" webform element.
Comment #9
Chris Matthews CreditAttribution: Chris Matthews commentedComment #10
Chris Matthews CreditAttribution: Chris Matthews commentedIn case it helps others who make their way here via Google, this was my issue: https://stackoverflow.com/a/31195820/12864276
Changing the status and version back to what it was previously.