Follow-up to #2809971: composable forms and Getting NYU onto YAML Form

Problem/Motivation

Site builders like be able to 'extend' a base form or combine multiple forms into a composite form.

Proposed resolution

Provide mechanism to build composite and/or base forms

Remaining tasks

User interface changes

API changes

Data model changes

Files: 

Comments

jrockowitz created an issue. See original summary.

jrockowitz’s picture

Right now, writing a custom composite element is best way to get a group of reusable elements.

Below are the two plugins and templates used to implement an Address element.

http://cgit.drupalcode.org/yamlform/tree/src/Element/YamlFormAddress.php
http://cgit.drupalcode.org/yamlform/tree/src/Plugin/YamlFormElement/Yaml...
http://cgit.drupalcode.org/yamlform/tree/templates/yamlform-composite-ad...

fenstrat’s picture

Project: YAML Form » Webform
Version: 8.x-1.x-dev » 8.x-5.x-dev
anpolimus’s picture

Issue tags: +KyivCampCS17
Sarah10’s picture

Thanks!!

Sarah10’s picture

Hi, I have created two plugins and template to implement custom composite element.

  • Then I have created fields, but they are not showing up anywhere.
  • I have enabled the option for "Unlimited values - it still didn't show up.
  • And then I tried unlimited values in the table format. It worked.

What am I doing wrong? Why is it not showing up without table format?

Thanks!

jrockowitz’s picture

You must configure and check 'Display elements in table columns'.

Sarah10’s picture

Yes, If I check the box "Display elements in table columns" - It is working perfectly fine.

If I do not check the box - Nothing is coming up., It's totally empty like blank screen

Sarah10’s picture

And even if I make it as "Limited" and number of values as "1" - It is showing up a blank screen.

jrockowitz’s picture

@sattapuram You might need to slowly duplicate an existing composite element and figure out what is missing from your custom element.

Sarah10’s picture

I figured it out....It is because of the theme..
Reverting to the core theme solved the issue.

Thanks!!

Sarah10’s picture

@jrockowitz How do I include File upload field in my composite element?

I tried in different ways...the field is showing up but the file is nowhere saved/uploaded.

jrockowitz’s picture

Complex elements (aka entity and file references) are not supported by composites without some hacking.

I am working on #2884624: Allow composite sub elements to be formatted which should help support complex elements with in composites.

gilles.koffmann’s picture

@Sarah10: I have the same problem as you. Field does not show up when it is not in table column.

What do you mean by "Reverting to the core theme solved the issue." ?

I have created my composite element in my own module and I ve basically duplicated the address composite element

I have added in mymodule_theme

function mymodule_theme($existing, $type, $theme, $path) {
  return [
    'webform_composite_participant' => [
      'render element' => 'element',
      'file' => 'includes/mymodule.theme.inc',
    ]
  ];
}

And in the mymodule.theme.inc i have added a preprocess function like this

function template_preprocess_webform_composite_participant(array &$variables) {
  $element = $variables['element'];
  foreach (Element::children($element) as $key) {
    if ($element[$key]['#access']) {
      $variables['content'][$key] = $element[$key];
    }
  }
  $variables['flexbox'] = (isset($element['#flexbox'])) ? $element['#flexbox'] : FALSE;
}

But it does not enter this function.

And finally I have added a template file webform-composite-participant.html.twig in the templates directory of my module

I´m using beta13

n3xo’s picture

How can i create a Custom Composite element? there is docs?

jrockowitz’s picture

There is no documentation. Hopefully someone can contribute some documentation.

lpalgarvio’s picture

Take a look at the example that I've published.
https://github.com/solsoft/Drupal8WebformCompositeExample

I pulled the code from a previous project that I developed and adapted for sharing.
It has not been tested, but should work with no or little changes.

jrockowitz’s picture

@lpalgarvio Your example inspired me to create #2893508: Add webform_example_composite.module. Thanks.