Реализация AJAX кнопки "Add more" с помощью progressive enhancement

Пример реализации формы с кнопкой Add more, добавляющей бесконечное количество полей Name:

Создаём форму, которая будет работать с выключенным Javascript:

/**
 * Form builder.
 */
function example_add_more_form($form, &$form_state) {
  $form['names'] = array(
    '#tree' => TRUE,
  );
 
  // See example_add_more_form_add().
  if (empty($form_state['name_count'])) {
    $form_state['name_count'] = 1;
  }
 
  for ($i = 0; $i < $form_state['name_count']; $i++) {
    $form['names'][$i]['name'] = array(
      '#type' => 'textfield',
      '#title' => t('Name'),
    );
  }
 
  $form['add_more'] = array(
    '#type' => 'submit',
    '#value' => t('Add more'),
    '#submit' => array('example_add_more_form_add'),
  );
 
  return $form;
}
 
/**
 * "Add more" button submit callback.
 */
function example_add_more_form_add($form, &$form_state) {
  $form_state['name_count']++;
  $form_state['rebuild'] = TRUE;
}

Добавляем AJAX функционал:

/**
 * Form builder.
 */
function example_add_more_form($form, &$form_state) {
  $form['names'] = array(
    '#tree' => TRUE,
    '#prefix' => '<div id="names-wrapper">', // <-- New
    '#suffix' => '</div>',                   // <-- New
  );
 
  // See example_add_more_form_add().
  if (empty($form_state['name_count'])) {
    $form_state['name_count'] = 1;
  }
 
  for ($i = 0; $i < $form_state['name_count']; $i++) {
    $form['names'][$i]['name'] = array(
      '#type' => 'textfield',
      '#title' => t('Name'),
    );
  }
 
  $form['add_more'] = array(
    '#type' => 'submit',
    '#value' => t('Add more'),
    '#submit' => array('example_add_more_form_add'),
    '#ajax' => array( // <-- New
      'wrapper' => 'names-wrapper',
      'callback' => 'example_add_more_form_update',
    ),
  );
 
  return $form;
}
 
/**
 * "Add more" button submit callback.
 */
function example_add_more_form_add($form, &$form_state) {
  $form_state['name_count']++;
  $form_state['rebuild'] = TRUE;
}
 
/**
 * "Add more" button ajax callback.
 */
function example_add_more_form_update($form, $form_state) { // <-- New
  return $form['names'];
}

Написанное актуально для
Drupal 7
Теги:
ajax, работа с формами
Добавлено: 30 Июля 2018 08:16:56 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...