Как обернуть два элемента массива рендеринга в div?

12

Учитывая этот рендеринг массив:

$output = array(
    'twitter-icon' => array(
      '#type' => 'markup',
      '#markup' => '<div class="twitter-icon"></div>'
    ),
    'twitter-link' => array(
      '#type' => 'markup',
      '#markup' => l('follow us on Twitter', 'https://twitter.com/#!/zujava'),
    ), 
  );

Как мне обернуть оба этих элемента в один DIV?

Джастин
источник

Ответы:

29

Вы также можете использовать #containerэлемент формы и код, подобный следующему:

$wrapper = array(
  '#type' => 'container',
  '#attributes' => array(
    'class' => array('class-name'),
  ),
);

$wrapper['twitter-icon'] => array(
  '#type' => 'markup',
  '#markup' => '<div class="twitter-icon"></div>'
);

$wrapper['twitter-link'] => array(
  '#type' => 'markup',
  '#markup' => l(t('follow us on Twitter'), 'https://twitter.com/#!/zujava'),
); 

Элемент #container оборачивает свои дочерние элементы <div>тегом, класс CSS которого передается в #attributesсвойстве.

Вы могли бы даже использовать контейнер для элемента «twitter-icon», но это не дает вам никаких преимуществ, за исключением случая, когда вы могли бы добавить элемент к этому, как в следующем коде:

$wrapper = array(
  '#type' => 'container',
  '#attributes' => array(
    'class' => array('class-name'),
  ),
);

$wrapper['twitter-icon'] => array(
  '#type' => 'container',
  '#attributes' => array(
    'class' => array('twitter-icon'),
  ),
);

if ($condition) {
  $wrapper['twitter-icon']['twitter-icon-text'] => array(
    '#type' => 'markup',
    '#markup' => t('Icon text'),
  );
}

$wrapper['twitter-link'] => array(
  '#type' => 'markup',
  '#markup' => l(t('follow us on Twitter'), 'https://twitter.com/#!/zujava'),
); 
киамлалуно
источник
Для меня это лучший ответ, так как он использует структуру физического массива для представления того, что переносится, будет лучше копировать и вставлять (перемещение элемента в ответе @ninjascorner может сломать открывающие / закрывающие DIV) и не требует дополнительных функции темы. Благодарность!
Джастин
Это правильно: вы можете добавить другой элемент, который отображается в том же контейнере, не перемещая #suffixсвойство из последнего элемента или #prefixсвойство из первого элемента, в новый добавленный элемент. Как вы сказали, это менее подвержено ошибкам.
kiamlaluno
6

Это то, что вы ищете?

$output = array(
    'twitter-icon' => array(
      '#type' => 'markup',
      '#markup' => '<div class="twitter-icon"></div>'
      '#prefix' => '<div class="test">',
    ),
    'twitter-link' => array(
      '#type' => 'markup',
      '#markup' => l('follow us on Twitter', 'https://twitter.com/#!/fdgf'),
      '#suffix' => '</div>',
    ), 
);

Надеюсь, это поможет!

ninjascorner
источник
@nija + 1ed, Отличный ответ Я забыл эти атрибуты. Пожалуйста, прочитайте мой ответ, может ли это быть достигнуто с помощью альтернативы суффиксу и префиксу на основе тем.
stefgosselin
@stefgosselin, ты имеешь в виду, что хочешь создать tpl-файл для темы?
ниндзяскорнер
Спасибо за этот ответ. Я знал, как сделать это для одного элемента, но мне не пришло в голову разделить суффикс и префикс. Интересный. Мне это кажется грязным, но я не могу сформулировать, почему, поэтому у меня не может быть проблем.
Джастин
@ninjascorner Извините за задержку, я не смог найти заметку на эту тему. Существует также, я думаю, способ менее элегантный, чем другие ответы, который можно использовать в теме или модуле, использующем хук темы. theme_render_example_add_div См. Api.drupal.org/api/examples/… )
stefgosselin
Это хорошо, только если вы уверены, что оба элемента будут отображаться всегда. При таком разделении легко получить незакрытый <div>.
Куфейко
2

Вы также можете создать тему для этого.

$form['twitter']['#theme'] = 'my_twitter_theme';

$form['twitter']['icon'] = array(
'twitter-icon' => array(
  '#type' => 'markup',
  '#markup' => '<div class="twitter-icon"></div>'
);

$form['twitter']['link'] = array(
  '#type' => 'markup',
  '#markup' => l('follow us on Twitter', 'https://twitter.com/#!/zujava'),
);

И в твоей теме крючок:

function my_hook_theme(){
  return array(
    'my_twitter_theme' => array('form' => NULL)
  );
} 

И в функции темы:

function theme_my_twitter_theme($form){
  $output = "";

  $output .= "<div class=\"twitter\">";
  $output .= drupal_render($form['icon']);
  $output .= drupal_render($form['link']);
  $output .= "</div>";    

  $output .= drupal_render($form);
  return $output;
}

Я использую это в Drupal 6, я не уверен, работает ли также в D7, но я надеюсь, что так

Gnuget
источник
Да, я понял этот метод после публикации (ну, я копирую модуль примеров). Он отлично работает, но я не считаю его лучшим методом, потому что (если я правильно понимаю), вы должны поместить имя вашего класса в функцию, что уменьшает его повторное использование.
Джастин