Custom element configuration form

I am looking for a better (or perhaps the correct) way to create a customized set of controls for my custom webform element. I am implementing what feels like a workaround now and am wondering if there's a better way.

For now, I am doing this by implementing the following hook:

hook_form_webform_ui_element_form_alter(&$form, FormStateInterface $form_state)

However, this is called for every webform element, so it seems less than ideal. I am using $form['properties']['type']['#value'] to determine if my code should run.

Here's what I tried previously:

I created a new element based on WebformCompositeBase and added a form() function in my WebformCompositeBase plugin subclass CustomElement (using WebformElementBase plugin class as a guide for the implementation of the form() function).

public function form(array $form, FormStateInterface $form_state) {

My custom function was called in previous versions of webform, but now (5.0.0-rc24) it doesn't seem to get called at all. But even when it was getting called, any new form elements I introduced didn't appear in the configuration form. I could, however, manipulate existing elements.

This worked:

    $form['composite']['#title'] = (string) $this->t('I have customized the title of the composite settings area.');
    $form['composite']['flexbox'] = [];
    $form['composite']['select2'] = [];

But the following additions to the form did not get reflected in the UI:

  $form['my_custom_element_module'] = [
    '#type' => 'details',
    '#title' => t('My Custom Options'),
    '#description' => (string) t('The below custom properties are custom.'),
    '#open' => TRUE,
    '#weight' => -20,
  ];

  $form['my_custom_element_module']['my_property'] = [
    '#type' => 'radios',
    '#title' => (string) t("Do you want this to show in red or black?"),
    '#options' => ['red' => 'Red', 'black' => 'Black'],
    '#description' => (string) t("This determines the color"),
    '#parents' => ['my_custom_element_module', 'my_property'],
    '#default_value' => 'black',
  ]

Comments

john.p.baldwin.jr created an issue. See original summary.

jrockowitz’s picture

Can you attach just your custom composite element in a custom module?

You should use \Drupal\webform\Plugin\WebformElementInterface::form.

You MUST make sure to define all default (custom) properties for your custom element via \Drupal\webform\Plugin\WebformElementInterface::getDefaultProperties

jrockowitz’s picture

@see \Drupal\webform_example_element\Plugin\WebformElement\WebformExampleElement::form

john.p.baldwin.jr’s picture

The piece I was missing was the definition of custom properties via getDefaultProperties. Once I added my custom properties there, I was able to build the config form and get the settings during the render phase.

Thank you.

jrockowitz’s picture

Status: Active » Closed (works as designed)