Modal Error Messages Displaying on Main page I have a page. Once i click on Button on that page. It opens jQuery Modal.

In that Modal Box. I'm rendering Form. I have put 1 fields test as required true.

Issue is when I click on Submit button. It closes Modal Box &amp; showing errors on Main Page.

I need that when it clicks on Submit button. It will not close Modal Box &amp; Display errors on Modal box instead of Main page.
I know this is pretty old so hopefully you found another solution by now. Since I happened to come across this near the top of my Google search for a slightly different issue though...

In your form_alter hook for the modal, you will need to add something like this:

$form['#prefix'] = '&lt;div id="modal-form"&gt;';
$form['#suffix'] = '&lt;/div&gt;';
$form['status_messages'] = [
    '#type' =&gt; 'status_messages',
    '#weight' =&gt; -10,
];


Then the callback function for your form that closes the modal and such will need to look something like this:

$response = new AjaxResponse();

// If there are any form errors, re-display the form.
if ($form_state-&gt;hasAnyErrors()) {
    $response-&gt;addCommand(new ReplaceCommand('#modal-form', $form));
} else {
    //Close the modal.
    $command = new CloseModalDialogCommand();
    $response-&gt;addCommand($command);
}
return $response;


This will tell it to apply the error message to your #modal-form div instead of the form in the background.