'; $form['#suffix'] = ''; // The status messages that will contain any form errors. $form['status_messages'] = [ '#type' => 'status_messages', '#weight' => -10, ]; // A required checkboxes field. $form['select'] = [ '#type' => 'checkboxes', '#title' => $this->t('Select Destination(s)'), '#options' => ['random_value' => 'Some random value'], '#required' => TRUE, ]; $form['actions'] = array('#type' => 'actions'); $form['actions']['send'] = [ '#type' => 'submit', '#value' => $this->t('Submit modal form'), '#attributes' => [ 'class' => [ 'use-ajax', ], ], '#ajax' => [ 'callback' => [$this, 'submitModalFormAjax'], 'event' => 'click', ], ]; $form['#attached']['library'][] = 'core/drupal.dialog.ajax'; return $form; } /** * AJAX callback handler that displays any errors or a success message. */ public function submitModalFormAjax(array $form, FormStateInterface $form_state) { $response = new AjaxResponse(); // If there are any form errors, AJAX replace the form. if ($form_state->hasAnyErrors()) { $response->addCommand(new ReplaceCommand('#modal_example_form', $form)); } else { $response->addCommand(new OpenModalDialogCommand("Success!", 'The modal form has been submitted.', ['width' => 700])); } return $response; } /** * {@inheritdoc} */ public function validateForm(array &$form, FormStateInterface $form_state) {} /** * {@inheritdoc} */ public function submitForm(array &$form, FormStateInterface $form_state) {} /** * Gets the configuration names that will be editable. * * @return array * An array of configuration object names that are editable if called in * conjunction with the trait's config() method. */ protected function getEditableConfigNames() { return ['config.modal_form_example_modal_form']; } }