xandeadx.ru Блог музицирующего веб-девелопера

Drupal → Использование в формах элемента <button type="submit">

Опубликовано в

Как уже писал ранее, в Form API доступны три вида кнопок:

<input type="submit" />
<input type="button" />
<input type="image" />

Если же в форме нужно использовать элемент <button type="submit">...</button>, то можно поступить так:

1. Определить шаблон button_button:

/**
 * Implements hook_theme().
 */
function THEMENAME_theme() {
  return array(
    'button_button' => array(
      'render element' => 'element',
    ),
  );
}
 
/**
 * Button theme function.
 * @see theme_button().
 */
function THEMENAME_button_button($variables) {
  $element = $variables['element'];
  $element['#attributes']['type'] = 'submit';
  element_set_attributes($element, array('id', 'name'));
 
  $element['#attributes']['class'][] = 'form-' . $element['#button_type'];
  if (!empty($element['#attributes']['disabled'])) {
    $element['#attributes']['class'][] = 'form-button-disabled';
  }
 
  return '<button' . drupal_attributes($element['#attributes']) . '>' . $element['#value'] . '</button>';
}

2. В форме добавить кнопке свойство '#theme_wrappers' => array('button_button'):

/**
 * Form builder.
 */
function mymodule_myform($form, &$form_state) {
  ...
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Add') . ' <span class="icon icon-add"></span>',
    '#theme_wrappers' => array('button_button'),
  );
  ...
}
Написанное актуально для Drupal 7
Похожие записи

Комментарии RSS

Огромная благодарность за науку, но можно хотя бы намек когда нам это может пригодиться. Спасибо.

в примере есть намёк - вывод иконки в тексте кнопки

если использовать bootstrap в качестве base theme, этот функционал подключается автоматом.

как по мне, таки удобнее button чем input.

Для вывода иконки достаточно сделать так:

$form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Add'),
    '#attributes'=> array('class'=>array('pay-button'))
  );

И CSS:
.pay-button{
  background-image:url(../credit_card.png);
  background-repeat:no-repeat;
  background-position: left center;
  height:52px;
  padding-left:52px;
}

ничёси, а в бустрапе то не знают, что можно выводить иконки в бэкграунде

Оставить комментарий

Содержимое этого поля является приватным и не будет отображаться публично. Если у вас есть аккаунт в Gravatar, привязанный к этому e-mail адресу, то он будет использован для отображения аватара.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Доступные HTML теги: <a> <i> <b> <strong> <code> <ul> <ol> <li> <blockquote> <em> <s>
  • Строки и параграфы переносятся автоматически.
  • Подсветка кода осуществляется с помощью тегов: <code>, <css>, <html>, <ini>, <javascript>, <sql>, <php>. Поддерживаемые стили выделения кода: <foo>, [foo].

Подробнее о форматировании