Problem/Motivation
When configuring a data form element to be conditionally required, its parent element becomes required too. This is an issue because the parent element is a div tag by default, and div tags should not have required attributes.
Steps to reproduce
- Create a webform
- Add a select field with 2 options A and B
- Add a date field and configure it to be required only if option B is selected.
- Notice how by default both the date field and its parent element get a "data-drupal-states" attribute with encoded JSON.
- After selecting option B from select field, notice how both the date field and its parent element get the "required" attribute enabled.
You can also import the YAML content below to reproduce this issue.
option:
'#type': select
'#title': Options
'#options':
A: A
B: B
date:
'#type': date
'#title': Date
'#states':
required:
':input[name="option"]':
value: B
Proposed resolution
Remove the line in \Drupal\webform\Plugin\WebformElement\DateBase::prepare() that adds the "data-drupal-states" attribute to the date field parent element. I suspect this was needed in the past, before the HTML date field existed.
Remaining tasks
- Create MR
User interface changes
N/A
API changes
N/A
Data model changes
N/A
Issue fork webform-3629212
Show commands
Start 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:
Comments
Comment #3
mmenavas commentedIt looks like there's more work to do here as the MR does not fix the issue for multi-value date elements. I appreciate any feedback or guidance from the community to find a solid fix for this issue.