Cambia classe sul wrapper div di un elemento modulo

C'è un modo per aggiungere o modificare una classe in un form wrapper (i div) usando il modulo api?

O è stato appena fatto con la funzione tema?

In tal caso, quale funzione del tema viene utilizzata per cambiarlo?

È possibile sostituire theme_form_element()normalmente se si desidera modificare il tema a livello globale. Se sei interessato a modificare solo un elemento del modulo specifico, sono consapevole di un paio di scelte.

1. Puoi registrare una nuova funzione tema per il tipo particolare di elemento del modulo che ti interessa (es. Campo di testo). È quindi possibile creare questa funzione tema (basata sull'originale, ad es. theme_textfield()) Ma che non chiama theme('form_element', ...)alla fine (è possibile gestire sia il wrapper che l'elemento in una funzione tema, oppure è possibile creare una funzione tema wrapper separata e usalo). Infine aggiungi una #themeproprietà a un particolare elemento del modulo e quell'elemento otterrà il tuo tema personalizzato.

2. È possibile creare un file modello chiamato form_element.tpl.phpche ha solo il comportamento predefinito di theme_form_element()e quindi utilizzare hook_preprocess_form_element()per aggiungere un suggerimento modello. Quindi si crea il nuovo modello che corrisponde al suggerimento. Senti spesso le persone che menzionano che i modelli sono leggermente più lenti delle funzioni e, per una chiamata a tema così frequentemente usata, posso immaginare che le persone si stancino di usare un modello. Tuttavia, non ho mai effettuato alcuna misurazione per questo. Inoltre, è necessario disporre di un contesto sufficiente nella fase di preelaborazione per poter fornire il suggerimento.

So che questo è un thread molto vecchio, ma ho imparato a modificare gli elementi del modulo e ad aggiungere classi. Ho cercato di creare un modulo personalizzato:

function yourtheme_custom_form_alter(&$form, &$form_state, $form_id) {
 case'webform_number_whatever':
   _yourtheme_form_add_wrapper($form['submitted']['yourfieldhere'], array('form-field-some-style', 'not-label', 'whatever-other-styles-you-want'));
 break;
}

function _yourtheme_form_add_wrapper(&$element, $classes = array(), $type = array('form-item', 'form-type-textfield'), $removeTitle = FALSE){
  $element['#prefix'] = '<div class="' . implode(" ", $classes) . '"><div class="' . implode(" ", $type) . '">';
  $element['#suffix'] = '</div></div>';
}

Per cambiare il "wrapper" devi sovrascrivere form_element. Fondamentalmente tutti gli elementi del modulo vengono resi con il tema theme_form_element($element,$value);form_element (file form.inc)

Quindi, per cambiare il modo in cui questo rende i tuoi elementi del modulo, devi semplicemente copiare quella funzione nella cartella template.php e rinominarla in: phptemplate_form_element($element,$value)

ora puoi apportare eventuali modifiche e verranno utilizzate al posto della funzione originale

1. Copia theme_form_element($element,$value);da form.inc
2. Incollalo in (il tuo tema) template.php
3. rinominalo in: phptemplate_form_element($element,$value)
4. svuota tutta la cache dei temi
5. apporta le modifiche che desideri e verranno utilizzate.

È possibile utilizzare la proprietà wrapper_attributes .

$form['example'] = [
  '#type' => 'textfield',
  '#title' => $this->t('Example'),
  '#wrapper_attributes' => ['class' => ['wrapper-class']],
];

È importante sottolineare che theme_form_element modificherà solo il div del wrapper parent diretto e questo potrebbe non essere l'obiettivo previsto per gli effetti CSS.

[Sebbene non sia programmatico, se si desidera semplicemente applicare una classe al top-wrapper di un campo nodo (è wrapper, wrapper, wrapper) si può supporre che si usi il modulo "Gruppo di campi" selezionando "Gestisci campi" per un particolare tipo di contenuto e seleziona "Aggiungi nuovo gruppo" come semplice DIV. Quindi l'etichetta può essere rimossa e le classi desiderate assegnate al wrapper aggiuntivo (ma ora abbiamo ancora più wrapper) - con annidamento illimitato]

Puoi usare

'#prefix' => '<div class="new_class">', '#suffix' => '</div>'

e questo lo avvolgerà

Rendi configurabili gli attributi wrapper!

Crea la tua funzione tema elemento forma nel tuo tema ... sites/all/themes/MY_THEME/theme/form-element.theme.inc

function my_theme_form_element($variables) {
  $element = &$variables['element'];

  $attributes = isset($element['#my_theme_wrapper_attributes']) ?
    $element['#my_theme_wrapper_attributes'] : array();

  ...

  $output = '<div' . drupal_attributes($attributes) . '>' . "\n";

  ...
}

Quindi puoi fare cose come questa ...

function my_module_form_alter(&$form, &$form_state, $form_id) {
  $form['account']['mail']['#my_theme_wrapper_attributes']['class'][] = 'form-field--inline';
}

Ci sono casi in cui né #prefix/#suffixné #attributes => array('class')danno i risultati desiderati. Il mio caso particolare è l'aggiunta di una classe al div ajax-wrapper attorno a un elemento managed_file. #prefix/#suffixcrea un nuovo contenitore e #attributes/'class'modifica la classe di un elemento interno, non quella più esterna.

Il div più esterno normale è giusto

<div id="edit-doc1--XX-ajax-wrapper">

che è difficile scegliere come target nei CSS. Posso scegliere come target [id^="edit-doc"]o [id$="-ajax-wrapper"]entrambi questi obiettivi più che solo gli elementi che volevo.

La soluzione che mi è venuta in mente è aggiungere un #processelemento al modulo e manipolare manualmente il codice dell'elemento. Ecco l' #processattributo aggiunto alla dichiarazione dell'elemento del modulo:

$form['doc1'] = array(
  '#type' => 'managed_file',
  '#process' => array('mymodule_managed_file_process'),
);

Ed ecco la mymodule_managed_file_process()funzione:

function mymodule_managed_file_process($element, &$form_state, $form) {

  // Call the original function to perform its processing.
  $element = file_managed_file_process($element, $form_state, $form);

  // Add our own class for theming.
  $element['#prefix'] = str_replace(
    'id=',
    'class="managed-file-wrapper" id=',
    $element['#prefix']
  );

  return $element;
}

Affidarsi alla sostituzione delle stringhe non è molto portatile, quindi utilizzare str_replacea proprio rischio. Questo codice, tuttavia, modifica effettivamente il DIV più esterno per aggiungere la classe necessaria:

<div class="managed-file-wrapper" id="edit-doc1--XX-ajax-wrapper">

<?php
    $form['#attributes'] = array('class' => 'your-class-name');
?> 

È possibile utilizzare il modo sopra per aggiungere una classe sull'elemento modulo.