Problem/Motivation

When previewing a webform, any CSS classes added to the webform via the Advanced tab of the element is not displayed.

A code snippet from the form page.

<div id="edit-terms-of-this-booking" class="fieldset-walton form-item js-form-item form-wrapper js-form-wrapper panel panel-default">

The same snippet from the preview page.

<div id="bookings--terms_of_this_booking" class="webform-container webform-container-type-fieldset form-item js-form-item form-wrapper js-form-wrapper panel panel-default">

As you can see, the custom CSS class fieldset-walton is not included in the class list. This means that any classes added are not included in the preview and maybe not included in the email that is submitted after I click the Submit button.

I have attached the exported yml file.

CommentFileSizeAuthor
#8 3014769-8.patch18.69 KBjrockowitz
#4 Screen Shot 2018-11-19 at 10.34.25 AM.png47.68 KBjrockowitz
#4 3014769-4.patch12.91 KBjrockowitz
webform.webform.bookings.yml20.09 KBtaxicab221

Comments

taxicab221 created an issue. See original summary.

jrockowitz’s picture

jrockowitz commented

The element and wrapper classes are only for form display. To customize the preview and email display you will need to use your theme to alter the templates.

jrockowitz’s picture

jrockowitz commented

I would be open to adding #display_attributes support to the webform-element-base-html.html.twig template via template_preprocess_webform_element_base_html().

Keep in mind that the markup for HTML emails is very basic and does not rely on CSS classes.

jrockowitz’s picture

jrockowitz commented
StatusFileSize
new 3014769-4.patch12.91 KB
new Screen Shot 2018-11-19 at 10.34.25 AM.png47.68 KB

The attached patch adds support for Display wrapper attributes (#format_attributes)

taxicab221’s picture

taxicab221 commented

Thanks for your prompt reply. Will apply the patch and learn how to write twig templates.

Fantastic module by the way. Looking forward to many more enhancements.

jrockowitz’s picture

jrockowitz commented
Status: Active » Needs review

Status: Needs review » Needs work

The last submitted patch, 4: 3014769-4.patch, failed testing. View results
- codesniffer_fixes.patch Interdiff of automated coding standards fixes only.

jrockowitz’s picture

jrockowitz commented
Status: Needs work » Needs review
StatusFileSize
new 3014769-8.patch18.69 KB
jrockowitz’s picture

jrockowitz commented
Status: Needs review » Fixed

  • jrockowitz committed d71e51f on 8.x-5.x 
    Issue #3014769 by jrockowitz, taxicab221: Element css class not included...
jrockowitz’s picture

jrockowitz commented
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

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