国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

J'ai une application Laravel qui a une bo?te modale sur la page d'affichage qui permet à l'utilisateur d'ajouter des données à la base de données. Par défaut, le modal dispara?t lorsque l'utilisateur clique sur le bouton de soumission et le backend renvoie une erreur. Je souhaite garder la bo?te modale visible lorsqu'une erreur se produit. Comment puis-je atteindre cet objectif ?

Bouton qui déclenche le modal

<div><button class="add" data-modal-target="#modal-box">Add New Year</button></div>

Mon modal

<div class="modal-box" id="modal-box">
    <div class="modal-header">
        <div class="title"><h1>Create School Year</h1></div>
        <div data-close-button class="modal-close-btn">
            <span class="material-symbols-sharp">close</span> 
        </div>   
    </div>
    <hr>
    <div class="modal-body">
        <form action="{{ route('create.year') }}" method="post">
            @csrf
            <div class="input-form">
                <div class="form-group">
                    <h3>School Year <span class="danger">*</span></h3>
                    <input type="text" name="name" id="name">
                    @error('name')
                        <p class="error danger">{{ $message }}</p>
                    @enderror    
                </div>
                <div>
                    <button type="submit" class="create">Create Year</button>
                </div> 
            </div>
        </form>    
    </div>
</div>

Bo?te modale de commutation JavaScript

const openModalButtons = document.querySelectorAll("[data-modal-target]");
const closeModalButtons = document.querySelectorAll("[data-close-button]");
const overlay = document.getElementById("overlay");

openModalButtons.forEach((button) => {
  button.addEventListener("click", () => {
    const modal = document.querySelector(button.dataset.modalTarget);
    openModal(modal);
  });
});

closeModalButtons.forEach((button) => {
  button.addEventListener("click", () => {
    const modal = button.closest(".modal-box");
    closeModal(modal);
  });
});

overlay.addEventListener("click", () => {
  const modals = document.querySelectorAll(".modal-box.active");
  modals.forEach((modal) => {
    closeModal(modal);
  });
});

function openModal(modal) {
  if (modal == null) return;
  modal.classList.add("active");
  overlay.classList.add("active");
}

function closeModal(modal) {
  if (modal == null) return;
  modal.classList.remove("active");
  overlay.classList.remove("active");
}

Mon contr?leur

public function CreateYear(Request $request)
{
    $validateData = $request->validate([
        'name' => 'required|unique:academic_years,name'
    ]);

    $data = new AcademicYear();
    $data->name = $request->name;
    $data->save();

    $notification = array(
        'message' => 'Academic Year Created Successfully!',
        'alert-type' => 'success'
    );

    return redirect()->route('view.year')->with($notification);
}