Кастомный html для радиокнопок

Главные вкладки

Аватар пользователя andreyks andreyks 20 ноября 2013 в 2:21

как придать радиокнопкам такую структуру? Нужно только для одной формы, переопределять все theme_form_element, theme_form_element_label, theme_radios, nicorette_radio очень неудобно

                    <div class="form-item">
                     <p>текст</p>
                      <label>
                        <input type="radio" value="1" name="radio-2">
                        опция 1
                      </label>
                      <label>
                        <input type="radio" value="2" name="radio-2">
                        опция 2
                      </label>
                    </div>

Комментарии

Аватар пользователя andreyks andreyks 20 ноября 2013 в 13:13

"enemis" wrote:
А также можно сделать темизацию для формы + CSS.

к сожалению нет, надо строго придерживаться предоставленной вёрстки

"serega111" wrote:
Через hook_form_FORM_ID_alter добавляете к радиокнопкам элемент '#theme' и создаете свою функцию темизации для этого элемента.

А есть примеры такой темизации? Я про про это думал, но пока не нашёл как конкретно реализовать

Аватар пользователя serega111 serega111 20 ноября 2013 в 14:18

Примеры темизации элементов форм
http://xandeadx.ru/blog/drupal/65 (тут для друпал 6, но в 7 все также)
http://romka.eu/blog/drupal-article-3-part-3-drupal-forms-api (есть небольшое описание темизации)

В вашем случае нужно создать модуль, в модуле примерно такой код
<?php
function hook_form_FORM_ID_alter(&$form, $form_state) {
$form['target_element']['#theme'] = 'my_custom_radiobutton';
}

function hook_theme() {
return array(
'my_custom_radiobutton' => array(
'arguments' => array('element' => NULL),
),
);
}

function theme_my_custom_radiobutton($variables) {
// тут возвращаем строку с HTML для вашего элемента.
}
?>
Смотрите код в стандартных функциях темизации для примера theme_radio theme_form_element_label

Аватар пользователя serega111 serega111 20 ноября 2013 в 19:39

"Chyvakoff" wrote:
Можно через suffix и preffix добавить тот же html. Без темизирующей функции.

Судя по коду html из поста, там нужно input обернуть в label. А это через suffix и prefix не получится

Аватар пользователя andreyks andreyks 20 ноября 2013 в 20:12

Проблема полностью не решена. Но двигаюсь в правльном направлении, всем спасибо!

Осталось оригинальный label убрать, а то их сейчас два пропечатывается

у элемента формы указываю

<?php
'#type' => 'radios',
      
'#title' => 'title',
      
'#options' => $options,
      
'#theme' => 'my_radios'?>

в hook_theme:

<?php
$theme
['my_radios'] = array(
    
'render element' => 'element',
    
'arguments' => array('element' => NULL),
    
'template' => 'theme/my-radios',
  );
?>

my-radios.tpl.php:

<div class="form-item">
  <p><?php print $element['#title']; ?></p>
  <?php foreach ($element['#options'] as $key => $option ) { ?>
  <label>
    <input type="radio" value="<?php print $element[$key]['#return_value']; ?>" name="<?php print $element[$key]['#name']; ?>"<?php print $element[$key]['#return_value'] == $element['#value'] ? ' checked' : ''; ?>>
    <?php print $element[$key]['#title']; ?>
  </label>
  <?php } ?>
</div>
Аватар пользователя Chyvakoff Chyvakoff 21 ноября 2013 в 9:17

"serega111" wrote:
Судя по коду html из поста, там нужно input обернуть в label. А это через suffix и prefix не получится

Вопрос на засыпку. Что делают suffix и prefix ?
На орге прекрасный пример:

$form['choice'] = array(
  '#type' => 'fieldset',
  '#title' => t('Choices'),
  '#prefix' => '<div class="poll-form">',

  '#suffix' => '</div>',
  '#tree' => TRUE,
);

Аватар пользователя andreyks andreyks 21 ноября 2013 в 22:21

вот решение, всем спасибо!

<?php

function mymodule_theme($existing$type$theme$path) {
  
$theme = array();
  
// Theme for radio group.
  
$theme['my_radios'] = array(
    
'render element' => 'element',
    
'arguments' => array('element' => NULL),
  );
  
// Theme for single radio.
  
$theme['my_radio'] = array(
    
'render element' => 'element',
    
'arguments' => array('element' => NULL),
  );

  return 

$theme;
}

function 

theme_my_radios($variables) {
  
$element = &$variables['element'];
  
$keys array_keys($element['#options']);

  

$output '<p>' filter_xss_admin($element['#title']) . '</p>';
  foreach (
$keys as $key) {
    
// Each radios is theme by calling our custom 'my_radio' theme function.
    
$output .= theme('my_radio'$element[$key]);
  }

  return 

$output;
}

function 

theme_my_radio($variables) {
  
$element = &$variables['element'];
  
_form_set_class($element, array('form-radio'));
  
$output '<input type="radio" ';
  
$output .= 'id="' $element['#id'] . '" ';
  
$output .= 'name="' $element['#name'] . '" ';
  
$output .= 'value="' $element['#return_value'] . '" ';
  
$output .= (check_plain($element['#value']) == $element['#return_value']) ? ' checked="checked" ' ' ';
  
$output .= drupal_attributes($element['#attributes']) . ' />';
  if (!
is_null($element['#title'])) {
    
$output '<label>' $output ' ' filter_xss_admin($element['#title']) . '</label>';
    
//$output = '<label class="option" for="' . $element['#id'] . '">' . $output . ' ' . $element['#title'] . '</label>';
  
}

  unset(

$element['#title']);
  return 
$output;
}
?>

И для элемента формы указываем

<?php
'#type' => 'radios',
'#options' => $answer_options,
'#theme' => 'my_radios',
'#theme_wrappers' => array(),
'#title_display' => 'none',?>