From 92d53f202d870ef544a2141c55ea630aeb32ffbe Mon Sep 17 00:00:00 2001 From: "hugo.pradier2" Date: Wed, 15 May 2024 22:23:17 +0200 Subject: [PATCH] formulaire de contact fonctionnel --- assets/js/sendEmail.js | 54 +++++++++++++++++++ index.html | 115 ++++++++++++++++++++++++++++++++++++----- 2 files changed, 157 insertions(+), 12 deletions(-) create mode 100644 assets/js/sendEmail.js diff --git a/assets/js/sendEmail.js b/assets/js/sendEmail.js new file mode 100644 index 0000000..4648f3c --- /dev/null +++ b/assets/js/sendEmail.js @@ -0,0 +1,54 @@ +function sendEmail() { + const firstName = document.getElementById("firstname").value; + const name = document.getElementById("name").value; + const email = document.getElementById("email").value; + const phone = document.getElementById("phone").value; + const message = document.getElementById("message").value; + + // Vérifier que tous les champs sont remplis + if ( + firstName.trim() === "" || + name.trim() === "" || + email.trim() === "" || + phone.trim() === "" || + message.trim() === "" + ) { + alert("Veuillez remplir tous les champs."); + return; + } + + // Vérifier le format de l'e-mail avec une regex + const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + if (!emailRegex.test(email)) { + alert("Veuillez entrer une adresse e-mail valide."); + return; + } + + // Vérifier le format du numéro de téléphone avec une regex + const phoneRegex = /^\d{10}$/; + if (!phoneRegex.test(phone)) { + alert("Veuillez entrer un numéro de téléphone valide (10 chiffres)."); + return; + } + + const serviceID = "service_v7bbwjc"; + const templateID = "template_rij5pjp"; + + emailjs + .send(serviceID, templateID, { + firstname: firstName, + name: name, + email: email, + phone: phone, + message: message, + }) + .then( + () => { + alert("Votre message a bien été envoyé !"); + document.getElementById("contact-form").reset(); + }, + (err) => { + alert("Désolé, une erreur s'est produite. Veuillez réessayer."); + } + ); +} diff --git a/index.html b/index.html index f22b5ac..1d08a6d 100644 --- a/index.html +++ b/index.html @@ -26,6 +26,18 @@ rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" /> + + + + + @@ -65,7 +77,7 @@ Expériences
  • - Parcours + Formation
  • Compétences @@ -93,12 +105,50 @@ Alternant Développeur

    Bienvenue sur mon portfolio !

    + + + + + + + + +
    + +

    Dans ce portfolio, je vous invite à découvrir en détail mes - compétences, mon parcours et mes diverses expériences. + compétences, ma formation et mes diverses expériences.

    N'hésitez pas à me contacter pour toute question ou opportunité @@ -175,10 +225,10 @@

    - -
    + +
    -

    Parcours

    +

    Formation

    @@ -260,7 +310,6 @@
    @@ -433,5 +520,9 @@ integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous" > + + + +