Increment or Decrement number of Fields Dynamically using Form API and Ajax

In this example, we will use a field to get tags list, the number of tags dynamic.

1. Create a custom form (See the tutorial)

2. Add tags field

$form['tags'] = [

  '#type' => 'details',

  '#title' => "Tags",

  '#open' => TRUE,

  '#description' => "The description of the field.",

];

$form['tags']['addtag'] = [

  '#type' => 'submit',

  '#value' => t('Add one more'),

  '#submit' => ['::addOneTag'],

  '#weight' => 100,

  '#ajax' => [

    'callback' => '::updateTagCallback',

    'wrapper' => 'tagfields-wrapper',

    'method' => 'replace',

  ],

];

$form['tags']['remtag'] = [

  '#type' => 'submit',

  '#value' => t('Remove the last'),

  '#submit' => ['::remOneTag'],

  '#weight' => 100,

  '#ajax' => [

    'callback' => '::updateTagCallback',

    'wrapper' => 'tagfields-wrapper',

    'method' => 'replace',

  ],

];

$form['tags']['tag_values'] = [

  '#type' => 'container',

  '#tree' => TRUE,

  '#prefix' => '<div id="tagfields-wrapper">',

  '#suffix' => '</div>',

];

$number_of_tags = $form_state->get('number_of_tags');

if (empty($number_of_tags)) {

  $number_of_tags = 1;

  $form_state->set('number_of_tags', $number_of_tags);

}

for ($i = 0; $i < $number_of_tags; $i++) {

  $form['tags']['tag_values'][$i] = [

    '#type' => 'entity_autocomplete',

    '#target_type' => 'taxonomy_term',

  ];

}

3. Add Callback methods:

  /**

   * Increment number of tags.

   */

  public function addOneTag(array &$form, FormStateInterface $form_state) {

    $number_of_tags = $form_state->get('number_of_tags');

    $form_state->set('number_of_tags', $number_of_tags + 1);

    $form_state->setRebuild(TRUE);

  }

  /**

   * Decrement number of tags.

   */

  public function remOneTag(array &$form, FormStateInterface $form_state) {

    $number_of_tags = $form_state->get('number_of_tags');

    $form_state->set('number_of_tags', $number_of_tags - 1);

    $form_state->setRebuild(TRUE);

  }

  /**

   * Return the tag list (Form)

   */

  public function updateTagCallback(array &$form, FormStateInterface $form_state) {

    return $form['tags']['tag_values'];

  }

Now you can add or remove tag fields dynamically