1

I have a custom form that submits via AJAX. On form error, i simply return the whole form on my callback function, and the HTML is replaced, but i want it to open a modal dialog on success. What is the best way to do this? This is what i'm currently doing (i don't like this solution because i can't clear the form values, among other things):

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

        drupal_get_messages(); // Hide the status messages

        $form_state->setRebuild(TRUE);

        if ($errors = $form_state->getErrors()) {

          return $form;
        }
        else {

          $response = new AjaxResponse();

          $title = 'Consectetur adipiscing elit';
          $text  = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.';

          $response->addCommand(new OpenModalDialogCommand($title, $text));

          return $response;
        }
      }
11
  • I did something very similar in a similar scenario.
    – Eyal
    Jul 12, 2017 at 10:53
  • Note that if you want to add the error messages to the AJAX form, you can just add the messages element to the start of the form.
    – Eyal
    Jul 12, 2017 at 10:54
  • What would really be perfect form me would be able to always return ajax commands. The problem is if i simply return $response->addCommand(new Command('#my-form-wrapper', drupal_render($form))); the form gets broken. the only way for ajax to keep functioning is returning the whole form, or not touching it at all. Jul 12, 2017 at 11:03
  • When you return the form array, drupal converts it to AJAX commands, so technically you can write those commands yourself, though i don't recommend it.
    – Eyal
    Jul 12, 2017 at 11:05
  • 2
    @JoséTrindade, this is exactly the opposite, you should not render early, because ajax commands which add html have a method to render and at the same time preserve the attachments most ajax forms need.
    – 4uk4
    Jul 12, 2017 at 20:37

1 Answer 1

0

Here is what i came up with (many thanks to @4k4):

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

        drupal_get_messages(); // Hide messages

        $form_state->setRebuild(TRUE);

        if ($errors = $form_state->getErrors()) {

           return $form; // Simply Return the form
        }
        else {

         $response = new AjaxResponse();

         $title = 'Consectetur adipiscing elit';
         $text  = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.';

        $response->addCommand(new OpenModalDialogCommand($title, $text));

        // Or add the $form as parameter to an HTML command.
        $response->addCommand(new ReplaceCommand('#my-form-wrapper', $form)); 

        // Do notice i added a wrapper to my form in the buildForm() method:
        // $form['#prefix'] = '<div id="my-form-wrapper">';
        // $form['#suffix'] = '</div>';

         return $response;
    }

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.