Генерация с помощью API формы

В качестве дополнения, на случай, если кто-то столкнется с той же проблемой, что и я, - при использовании #markup или #prefix/#suffix трюк с группой actions формы, функция обратного вызова отправки не будет вызываться вообще , если не присутствует элемент типа submit. Мой обходной путь был таким:

$form['actions']['submit'] = array
(
    '#type' => 'submit',
    '#value' => '',
    '#attributes' => array( 'style' => array( 'display: none' )), // hide the input field
    '#submit' => array( 'my_callback_for_the_form_submit' ),
    '#prefix' => '<button type="submit" class="btn btn-primary">Add <i class="fa fa-plus-square-o">',
    '#suffix' => '</i></button>',
);

Таким образом, вы можете использовать пользовательский HTML для отправки групп действий.

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

// Drupal 6.
$form = array();

// Other elements.

$form['custom-form'] = array(
    '#value' => '<button type="submit" class="clearfix"><span>Login</span></button>',
);

// Drupal 7.
$form = array();

// Other elements.

$form['custom-form'] = array(
    '#markup' => '<button type="submit" class="clearfix"><span>Login</span></button>',
);

Просто для полноты я опубликую альтернативное решение, которое включает переопределение theme_button (взято из этого сообщения в блоге)

Сначала добавьте атрибут buttontype к элементу формы:

$form['submit'] = array (
    '#type' => 'submit',
    '#buttontype' => 'button',
    '#value' => 'Search',
);

, А затем переопределите кнопку темы:

/**
 * Override of theme_button().
 *
 * Render the button element as a button and the submit element as an input element.
 */
function MYTHEME_button($variables) {
  $element = $variables['element'];
  $element['#attributes']['type'] = 'submit';

  element_set_attributes($element, array('id', 'name', 'value'));  

  $element['#attributes']['class'][] = 'form-' . $element['#button_type'];
  if (!empty($element['#attributes']['disabled'])) {
    $element['#attributes']['class'][] = 'form-button-disabled';
  }

  if (isset($element['#buttontype']) && $element['#buttontype'] == 'button') {
    $value = $element['#value'];
    unset($element['#attributes']['value']);
    return '<button' . drupal_attributes($element['#attributes']) . '>' . $value . '</button>';
  }
  else {
    return '<input' . drupal_attributes($element['#attributes']) . ' />';
  }
}

Однако это создает проблемы, если в форме больше одной кнопки, так как Drupal не может определить, какая кнопка была нажата.

Это можно решить, добавив обратный вызов #after_build в форма:

$form['#after_build'][] = 'mymodule_force_triggering_element';

, А затем в функции после сборки:

function mymodule_force_triggering_element($form, &$form_state) {
  if (isset($form_state['input']['submit'])) {
    $form_state['triggering_element'] = $form['submit'];
  } elseif (isset($form_state['input']['other_button'])) {
    $form_state['triggering_element'] = $form['other_button'];
  }
  return $form;
}

Я попытался ответить Оскару Гомесу Альканьису, но моя форма все еще не была отправлена. В качестве обходного пути я изменил его решение, чтобы ввод находился поверх кнопки, но был прозрачным:

$form['actions']['submit'] = array (
    '#type' => 'submit',
    '#value' => '',
    '#attributes' => array( 'style' => 'position: absolute; left: 0; right: 0; top: 0; bottom: 0; border: none; opacity: 0; width: 100%;'), // put input field over the top of button and make transparent
    '#prefix' => '<button type="submit" class="btn btn-primary">Add <i class="fa fa-plus-square-o">',
    '#suffix' => '</i></button>',
);

Таким образом, фактический input[type="submit] нажимается и запускает действие, но кнопка

Вероятно, хорошая идея поместить весь этот CSS в таблицу стилей в реальной жизни, но просто добавьте тег встроенного стиля здесь в качестве примера.

Вот как я добиваюсь этого в Drupal 8. В основном я создаю новое предложение темы, чтобы я мог переопределить кнопку с помощью пользовательского файла ветки.

Добавьте этот код в свой файл mythemename.theme:

/**
 * Add twig suggestions for input elements.
 *
 * If a form api element has a data-twig-suggestion attribute, then allow twig
 * theme override, add to suggestions.
 *
 * @param array $suggestions
 *   Current list of twig suggestions.
 * @param array $variables
 *   Every variable of the current element.
 */
function mythemename_theme_suggestions_input_alter(&$suggestions, array $variables) {
  $element = $variables['element'];

  if (isset($element['#attributes']['data-twig-suggestion'])) {
    $suggestions[] = 'input__' . $element['#type'] . '__' . $element['#attributes']['data-twig-suggestion'];
  }
}

В своем коде, где бы вы ни создавали свою форму, добавьте атрибут "данные-веточка-предложение" к кнопке отправки:

$form['submit'] = [
      '#type' => 'submit',
      '#value' => t('Submit') . ' >',
      '#attributes' => [
        'data-twig-suggestion' => 'button',
      ],
    ];

Теперь, если у вас включена отладка ветки и вы проверяете html-источник своей кнопки на сайте, вы увидите новую ветку предложение:

<!-- FILE NAME SUGGESTIONS:
   * input--submit.html.twig
   * input--submit--button.html.twig
   x input.html.twig
-->

Теперь вы можете создать файл input--submit--button.html.twig (я помещаю его в mythemename/шаблоны/form_elements, но вы можете разместить его в другом месте, если хотите):

<button{{ attributes }} type='submit'>
    <span class="great-success">Submit</span>
</button>

Более правильный способ:

$form['submit'] = array(
  '#type' => 'button',
  '#value' => '<span>Login</span>',
);

Он создает допустимый HTML-код следующим образом:

<button value="&lt;span&gt;Login&lt;/span&gt;" type="submit">
    <span>Login</span>
</button>

...и этот метод не тормозит автозаполнение и другие функции.