Problem/Motivation

Nested required element doesn't work. It's still marked as required event if it's already hidden.

Steps to reproduce

The configuration:

uuid: a3a2540d-c51d-4079-863a-0d51fb6df026
langcode: en
status: open
dependencies: {  }
open: null
close: null
weight: 0
uid: 63
template: false
archive: false
id: test_visibility
title: 'Test visibility'
description: ''
category: ''
elements: |
  page_1:
    '#type': webform_wizard_page
    '#title': 'Page 1'
    container:
      '#type': container
      name:
        '#type': textfield
        '#title': Name
        '#required': true
      add_member:
        '#type': checkbox
        '#title': 'Add member'
    container_01:
      '#type': container
      '#states':
        visible:
          ':input[name="add_member"]':
            checked: true
      telephone_1:
        '#type': tel
        '#title': Telephone
      type:
        '#type': radios
        '#title': Type
        '#options':
          A: A
          B: B
      container_02:
        '#type': container
        '#states':
          visible:
            ':input[name="type"]':
              value: A
        name_1:
          '#type': textfield
          '#title': Name
          '#required': true
  page_2:
    '#type': webform_wizard_page
    '#title': 'Page 2'
    telephone:
      '#type': tel
      '#title': Telephone
css: ''
javascript: ''
settings:
  ajax: false
  ajax_scroll_top: form
  ajax_progress_type: ''
  ajax_effect: ''
  ajax_speed: null
  page: true
  page_submit_path: ''
  page_confirm_path: ''
  page_theme_name: ''
  form_title: both
  form_submit_once: false
  form_exception_message: ''
  form_open_message: ''
  form_close_message: ''
  form_previous_submissions: true
  form_confidential: false
  form_confidential_message: ''
  form_remote_addr: true
  form_convert_anonymous: false
  form_prepopulate: false
  form_prepopulate_source_entity: false
  form_prepopulate_source_entity_required: false
  form_prepopulate_source_entity_type: ''
  form_reset: false
  form_disable_autocomplete: false
  form_novalidate: false
  form_disable_inline_errors: false
  form_required: false
  form_unsaved: false
  form_disable_back: false
  form_submit_back: false
  form_autofocus: false
  form_details_toggle: false
  form_access_denied: default
  form_access_denied_title: ''
  form_access_denied_message: ''
  form_access_denied_attributes: {  }
  form_file_limit: ''
  share: false
  share_node: false
  share_theme_name: ''
  share_title: true
  share_page_body_attributes: {  }
  submission_label: ''
  submission_log: false
  submission_views: {  }
  submission_views_replace: {  }
  submission_user_columns: {  }
  submission_user_duplicate: false
  submission_access_denied: default
  submission_access_denied_title: ''
  submission_access_denied_message: ''
  submission_access_denied_attributes: {  }
  submission_exception_message: ''
  submission_locked_message: ''
  submission_excluded_elements: {  }
  submission_exclude_empty: false
  submission_exclude_empty_checkbox: false
  previous_submission_message: ''
  previous_submissions_message: ''
  autofill: false
  autofill_message: ''
  autofill_excluded_elements: {  }
  wizard_progress_bar: true
  wizard_progress_pages: false
  wizard_progress_percentage: false
  wizard_progress_link: false
  wizard_progress_states: false
  wizard_auto_forward: true
  wizard_start_label: ''
  wizard_preview_link: false
  wizard_confirmation: true
  wizard_confirmation_label: ''
  wizard_track: ''
  wizard_prev_button_label: ''
  wizard_next_button_label: ''
  wizard_toggle: false
  wizard_toggle_show_label: ''
  wizard_toggle_hide_label: ''
  preview: 0
  preview_label: ''
  preview_title: ''
  preview_message: ''
  preview_attributes: {  }
  preview_excluded_elements: {  }
  preview_exclude_empty: true
  preview_exclude_empty_checkbox: false
  draft: authenticated
  draft_multiple: false
  draft_auto_save: false
  draft_saved_message: ''
  draft_loaded_message: ''
  draft_pending_single_message: ''
  draft_pending_multiple_message: ''
  confirmation_type: page
  confirmation_title: ''
  confirmation_message: ''
  confirmation_url: ''
  confirmation_attributes: {  }
  confirmation_back: true
  confirmation_back_label: ''
  confirmation_back_attributes: {  }
  confirmation_exclude_query: false
  confirmation_exclude_token: false
  confirmation_update: false
  limit_total: null
  limit_total_interval: null
  limit_total_message: ''
  limit_total_unique: false
  limit_user: null
  limit_user_interval: null
  limit_user_message: ''
  limit_user_unique: false
  entity_limit_total: null
  entity_limit_total_interval: null
  entity_limit_user: null
  entity_limit_user_interval: null
  purge: none
  purge_days: null
  results_disabled: false
  results_disabled_ignore: false
  results_customize: false
  token_view: false
  token_update: false
access:
  create:
    roles:
      - anonymous
      - authenticated
    users: {  }
    permissions: {  }
  view_any:
    roles: {  }
    users: {  }
    permissions: {  }
  update_any:
    roles: {  }
    users: {  }
    permissions: {  }
  delete_any:
    roles: {  }
    users: {  }
    permissions: {  }
  purge_any:
    roles: {  }
    users: {  }
    permissions: {  }
  view_own:
    roles: {  }
    users: {  }
    permissions: {  }
  update_own:
    roles: {  }
    users: {  }
    permissions: {  }
  delete_own:
    roles: {  }
    users: {  }
    permissions: {  }
  administer:
    roles: {  }
    users: {  }
    permissions: {  }
  test:
    roles: {  }
    users: {  }
    permissions: {  }
  configuration:
    roles: {  }
    users: {  }
    permissions: {  }
handlers: {  }
variants: {  }
  1. Enter value in "Name".
  2. Tick on "Add Member".
  3. Select "A" under "Type".
  4. Enter value in second field of "Name".
  5. Click on "Next Page".
  6. Click on "Previous Page".
  7. Untick "Add Member".
  8. Click on "Next Page".

It says and the "Name" field that is hidden is marked as required:

Name field is required.

Proposed resolution

Remaining tasks

User interface changes

API changes

Data model changes

Comments

dsdeiz created an issue. See original summary.

dsdeiz’s picture

Title: Hidden elements are still marked as required. » Hidden elements are still marked as required with multi-page.
gg24’s picture

Status: Active » Closed (cannot reproduce)
StatusFileSize
new125.92 KB

Hi,

I created a webform -

Where I created two pages.
- The first page had a Textarea field as a required field.
- Second page had two Textareas where both are required but the first is hidden and the second is not.

Now when we test the webform -
On the first page, the Textarea appears and on the second page, only Textarea which is not hidden appears. There are no issues in hidden required elements. Please refer to the screenshot attached.

There is a setting which makes sure that hidden element shouldn't be required. Attaching the screenshot along.

Hence closing the issue. Please feel free to open it again if the issue still persists.

dsdeiz’s picture

Status: Closed (cannot reproduce) » Active

Yeah, noting this still happens on 5.x-dev even with the "Clear value(s) when hidden" (enabled by default). Yeah, still using the same config in a fresh Drupal install and using the same steps as mentioned above.

paulocs’s picture

I could reproduce the error with the webform example provided in IS.
A quick workaround for you is to set name_1 field as optional if add_member field is unchecked.

jrockowitz’s picture

The issue is the Type radio button's value is not being cleared when it is hidden. It is very tricky to clear a radio button's value and post the empty value back to the server.

jrockowitz’s picture

Status: Active » Needs review
StatusFileSize
new746 bytes

Attached is an MVP patch that calls \Drupal\webform\WebformSubmissionConditionsValidator::submitForm before the validation.

If all tests pass we might want to refactor the WebformSubmissionConditionsValidator service and create a protected WebformSubmissionConditionsValidator::processForm method.

jrockowitz’s picture

StatusFileSize
new5.75 KB

Here is the same patch with the refactoring.

  • jrockowitz authored 907778d on 8.x-5.x
    Issue #3205406 by jrockowitz, gg24: Hidden elements are still marked as...

  • jrockowitz authored 907778d on 6.x
    Issue #3205406 by jrockowitz, gg24: Hidden elements are still marked as...
jrockowitz’s picture

Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.