Form error on layout section when using module layout_section_classes

Created on 12 October 2023, 9 months ago
Updated 22 February 2024, 4 months ago

Problem/Motivation

We use the module " Layout Section Class β†’ " to allow us to add configuration to layouts. This module was built to work with layout builder but we used it with "Layout Paragraphs" 1.x branch and everything worked fine. After updating to the new 2.x branch we now get a form error when we switch between sections on the Layout options.

Specifically we will get an error message on layout options that are shared amongst layouts that have different options per layout. So for example we have a 1 column Layout that has an option "Content Width" with a default value set as "[10]" (This number stands for the number of columns in a 12 column layout. When we switch to the 2 column layout which has a default value of "[5|5]" we get a form error saying "The submitted value [10] in the Content Width element is not allowed.". This error does not prevent the saving of the form or cause an issue to the functionality but is just an error that should not be displayed to the user.

The module "Layout Section Class" isn't doing anything special it is just replacing the "LayoutDefault" class with it's "ClassyLayout" class which just extends the "LayoutDefault".

Steps to reproduce

  • Add the module Layout Section Class
  • Add a classes component to a custom layouts definition in theme or custom module, I've uploaded an example custom layouts (custom_layouts.layouts.txt)
  • Add the layouts to a paragraph that is used for layout
  • Add a layout in the layout paragraphs field and switch between the layouts and the error will appear

Proposed resolution

I'm not sure, just want to bring this up in case other people use this module and this issue comes up. I think as a work around for now we will try and change the name of each option that has unique values per layout so the validation does not get triggered.

πŸ’¬ Support request
Status

Active

Version

2.0

Component

Code

Created by

πŸ‡¨πŸ‡¦Canada erichomanchuk

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @erichomanchuk
  • πŸ‡ΊπŸ‡ΈUnited States joegl

    We are also seeing this when we extend the core layout_builder module's MultiWidthLayoutBase class.

    When we switch layouts in the layout section pop-up and there the option selected for the current layout doesn't exist in the getWidthOptions() for the new layout, it spits out this error. It doesn't appear to have any affect and the error is actually coming from the submitConfigurationForm() method, and not buildConfigurationForm().

    For example, we have a three column and two column layouts both extending the MultiWidthLayoutBase:

    Three column:

    class ThreeColumn extends MultiWidthLayoutBase implements PluginFormInterface {
      protected function getWidthOptions() {
        return [
          '100' => '100%'
        ];
      }
    }
    

    Two column:

    class TwoColumn extends MultiWidthLayoutBase implements PluginFormInterface {
      protected function getWidthOptions() {
        return [
          '50-50' => '50% - 50%',
          '33-67' => '33% - 67%',
          '67-33' => '67% - 33%',
        ];
      }
    }
    

    When we switch from ThreeColumn to TwoColumn it complains because the 100 option doesn't exist in the TwoColumn (and vice-versa).

  • πŸ‡ΊπŸ‡ΈUnited States joegl

    To expand on this, I noticed in the LayoutParagraphsBehavior buildBehaviorForm() method there is a supposed to be an ajax callback that fires (ajaxUpdateOptions) when a layout is selected:

        $form['layout'] = [
          '#title' => $this->t('Choose a layout:'),
          '#type' => 'layout_select',
          '#options' => $available_layouts,
          '#default_value' => $default_value,
          '#ajax' => [
            'wrapper' => $wrapper_id,
            'callback' => [$this, 'ajaxUpdateOptions'],
            'progress' => [
              'type' => 'throbber',
            ],
          ],
          '#weight' => 0,
        ];
    

    The callback itself seems like it's supposed to rebuild the $form['config'] options (where the width options are):

      public function ajaxUpdateOptions(array $form, FormStateInterface $form_state) {
        $triggering_element = $form_state->getTriggeringElement();
        $parents = $triggering_element['#parents'];
        array_splice($parents, -1, 1, ['config']);
        $config_form = NestedArray::getValue($form, $parents);
        if (isset($config_form)) {
          return $config_form;
        }
        return [];
      }
    

    However, when a layout is selected this callback is not firing, and the submitBehaviorForm() method is ran instead. I'm not sure if that's how it's supposed to work or not.

  • πŸ‡ΊπŸ‡ΈUnited States joegl
  • πŸ‡ΊπŸ‡ΈUnited States joegl

    It looks like this error isn't "harmless" but actually causes paragraphs to be lost when switching between different layouts that have existing paragraphs in regions. Linked relevant issue.

Production build 0.69.0 2024