Altering Views Exposed Form Elements and their Associated Labels

Question

I have a series of Views Exposed Forms across a Drupal 8 website. My goal is to generate unique template suggestions so I can theme each individual input and their labels differently as needed.

Here is my current approach. Placed into theme.theme. I've hit a brick wall.

function HOOK_form_views_exposed_form_alter(array &$form, FormStateInterface $form_state, $form_id) { $form['#attributes']['twig-suggestion'] = $form['#id']; } function HOOK_theme_suggestions_input_alter(&$suggestions, array $variables) { $element = $variables['element']; if (isset($element['#attributes']['twig-suggestion'])) { $suggestions[] = 'input__' . $element['#type'] . '__' . $element['#attributes']['twig-suggestion']; } } function HOOK_theme_suggestions_form_element_label_alter(&$suggestions, &$variables, $hook) { $element = $variables['element']; if (isset($element['#attributes']['twig-suggestion'])) { $suggestions[] = 'label__' . $element['#attributes']['twig-suggestion']; } }

All input and label [#attributes] are null via Kint.
Here are the URLs I have referenced for background:

1) http://kevinquillen.com/drupal/2017/01/28/adding-twig-template-suggestions-for-form-elements

2) https://www.chapterthree.com/blog/how-to-create-custom-theme-suggestions-drupal-8

3) https://yellowpencil.com/blog/getting-granular-with-drupal-eight-forms/

berramou · Accepted Answer · 2019-01-12 23:17:33Z

Should add #attributes to your element form so the form alter should be like:

  function HOOK_form_views_exposed_form_alter(array &$form, FormStateInterface $form_state, $form_id) { $form['name_of_element']['#attributes']['twig-suggestion'] = $form['#id']; }

HOOK_theme_suggestions_input_alter will works only with input elements textfield.

You are so welcome, i'm glad that helped :)

berramou
– berramou

2019-01-15 11:04:39 +00:00
Commented Jan 15, 2019 at 11:04 — berramou
– berramou, Commented Jan 15, 2019 at 11:04

Wasim Khan · Accepted Answer · 2019-10-31 06:06:07Z

/* * hook_form_views_exposed_form_alter */ function THEMENAME_form_views_exposed_form_alter(&$form, &$form_state, $form_id) { if($form['#id'] == 'views-exposed-form-global-search-default'){ $form['#attributes']['class'][] = 'row popup-form'; //add form class $form['combine']['#attributes']['class'][] = 'search_input'; //add class to input $form['combine']['#attributes']['placeholder'][] = t('Search...'); $form['combine']['#theme_wrappers'] = []; //remove the extra stuff $form['actions']['submit']['#attributes']['class'][] = 'search_icon button'; //add class to button } }

Stack Exchange Network

Altering Views Exposed Form Elements and their Associated Labels

2 Answers 2

Hot Network Questions

Altering Views Exposed Form Elements and their Associated Labels

2 Answers 2

Related

Hot Network Questions