const form = document.querySelector("form");
const messageBox = document.getElementById("messageBox");

form.addEventListener("submit", function(e) {
  e.preventDefault(); // bloque le rechargement

  // ✅ Vérifie que tous les champs sont valides
  if (!form.checkValidity()) {
    // si invalides, on laisse le navigateur gérer les messages natifs
    form.reportValidity(); // affiche les messages d’erreur du navigateur
    return; // on ne continue pas
  }

  const formData = new FormData(form);

  fetch(form.action, {
    method: form.method,
    body: formData,
    headers: { "Accept": "application/json" }
  })
  .then(response => {
    if (response.ok) {
      messageBox.textContent = "Merci ! Votre message a été envoyé.";
      form.reset();
    } else {
      messageBox.textContent = "Oups ! Une erreur est survenue, veuillez réessayer.";
    }
  })
  .catch(error => {
    messageBox.textContent = "Oups ! Une erreur est survenue, veuillez réessayer.";
  });
});