Score:0

Use a different template file for front end and submission view

ng flag

I have defined a custom template file referenced via #theme for my custom webform element.

public function getInfo() {
  $class = get_class($this);
  return [
    '#input' => TRUE,
    '#process' => [
      [$class, 'processWebformElementSeatbooking'],
      [$class, 'processAjaxForm'],
    ],
    '#element_validate' => [
      [$class, 'validateWebformSeatbookingElement'],
    ],
    '#pre_render' => [
      [$class, 'preRenderWebformSeatbookingElement'],
    ],
    '#theme' => 'input__my_webform_seatbooking_element',
    '#theme_wrappers' => ['form_element'],
  ];
}

This input__my_webform_seatbooking_element is rendered fine in the front end, but I get an error when it is rendered in the back end when looking at a submission cause the icons used in the custom front end theme are missing.

Twig\Error\LoaderError: Template "core/themes/seven/assets/icons/icon_minus.svg" is not defined. in Twig\Loader\ChainLoader->getSourceContext() (line 30 of themes/custom/radix_standard/templates/form/input--number.html.twig).

The template file includes a custom input--number.twig template which contains a reference to two SVG files.

<div class="col-12 col-md-6">
  {% include '@hw_radix_standard/form/input--number.html.twig' with {
    attributes: attributes.addClass('form-number')
      .setAttribute('step', element['#step'])
      .setAttribute('min', element['#min'])
      .setAttribute('max', element['#max'])
      .setAttribute('max', element['#max'])
      .setAttribute('oninput', "this.value = this.value.replace(/[^0-9]+/g, '');"),
  } %}
</div>

I am using a customized radix-theme in the frontend and default seven-theme in the backend.
I would like to render it as plain input field in the backend.
If I put '#theme' => 'input__number', I get the plain input field in the back end, but I need a way to use my custom template file in the front end.
I am stuck here. I checked other render elements and webform code.

How is this normally designed to work?
Maybe I am doing it the wrong way round?
Do I have to put a simple twig inside my custom element module and put the fully featured in the radix?

Score:0
ng flag

Last thougt was correct. Put a simplified version of input--my-webform-seatbooking-element.html.twig inside the module and the full featured version in the frontend.

I sit in a Tesla and translated this thread with Ai:

mangohost

Post an answer

Most people don’t grasp that asking a lot of questions unlocks learning and improves interpersonal bonding. In Alison’s studies, for example, though people could accurately recall how many questions had been asked in their conversations, they didn’t intuit the link between questions and liking. Across four studies, in which participants were engaged in conversations themselves or read transcripts of others’ conversations, people tended not to realize that question asking would influence—or had influenced—the level of amity between the conversationalists.