'How to keep the modal open if the validation is failed in Laravel 8

I am trying to show the modal with the errors after the failure of the validation directly.

My code now shows the modal with the errors only if I clicked the button that shows it (to add a new user).

I have found some related answers but they did not work for me.

My controller

 function add(Request $req){

        $validated = $req->validate([
            'name'     => 'required|regex:/^[\pL\s\-]+$/u',
            'email'    => 'email|unique:users,email',
            'password' => 'required|min:8',
        ]);

modal.blade

<form action="addUser" method="post" enctype="multipart/form-data">
    @csrf
    <div class="modal fade text-left" id="ModalCreate" tabindex="-1" role="dialog" aria-hidden="true" >
        <div class="modal-dialog modal-lg" role="document" >
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">{{__('Add New User')}} </h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">


                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                      ...

                </div>
            </div>
        </div>
    </div>



</form>

The page that calls the modal


@extends('layouts.admin')

@section('content')

    <div class="container">

        <div class="float-right">
            <a href="#"  data-toggle="modal" data-target="#ModalCreate">
            <button type="button" class="btn btn-dark"><i class="bi bi-person-plus"></i></button>
            </a>
        </div><br><br>

        <table class="table">
...
        </table>

    </div>

@include('admin.Users.addUser')
@endsection



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source