Vous utilisez un navigateur obsolète, veuillez le mettre à jour.
Veuillez utiliser un navigateur internet moderne avec JavaScript activé pour naviguer sur OpenClassrooms.com
Une question ? Pas de panique, on va vous aider !
Bonjour à tous,
Je tente désespérément de valider mon formulaire avec submiot de jquery et ajax. le formulaire n'est pas envoyé.
Voici mon dode
html:
<form method="post" id="wp"> <div class="row"> <div class="col-12 col-md-6"> <h3>Vous recherchez plutôt :</h3> <div class="form-check"> <input class="form-check-input" value="blog" id="typew" type="radio" name="flexRadioDefault" id="flexRadioDefault2"> <label class="form-check-label" for="flexRadioDefault2"> Blog </label> </div> <div class="form-check"> <input class="form-check-input" value="e-commerce" id="typew" type="radio" name="flexRadioDefault" id="flexRadioDefault2" > <label class="form-check-label" for="flexRadioDefault2"> E-commerce </label> </div> <div class="form-check"> <input class="form-check-input" value="vitrine" id="typew" type="radio" name="flexRadioDefault" id="flexRadioDefault2" > <label class="form-check-label" for="flexRadioDefault2"> Vitrine </label> </div> </div> <div class="col-12 col-md-6"> <h3 >J'ai déjà un nom de domaine et un hébergement</h3> <div class="form-check"> <input class="form-check-input" value="oui" id="hebergementw" type="radio" name="flexRadioDefault12" id="flexRadioDefault"> <label class="form-check-label" for="flexRadioDefault"> Oui </label> </div> <div class="form-check"> <input class="form-check-input" value="non" id="hebergementw" type="radio" name="flexRadioDefault2" id="flexRadioDefault" > <label class="form-check-label" for="flexRadioDefault"> Non </label> </div> </div> </div> <div class="row top"> <div class="col-sm-12"><h3>Informations complémentaires</h3></div> <div class="col-sm-12 col-md-4"> <label for="">Votre nom</label> <input id="nonw" class="form-control" type="text" name="nomw" id=""> </div> <div class="col-sm-12 col-md-4"> <label for="">Votre e-mail</label> <input id="emailw" class="form-control" type="email" name="mailw" id="" required> </div> <div class="col-sm-12 col-md-4"> <Label>Votre téléphone</Label> <input id="phonew" class="form-control" type="text" name="telephonew" id="" required> </div> </div> <div class="row"> <div class="col-sm-12"> <label for="">Sujet</label> <input type="text" id="sujetw" class="form-control" required> </div> </div> <div class="row top"> <div class="col-sm-12"> <label for="">Décrivez votre besoin / projet</label> <textarea id="messagew" class="form-control" name="corp" id="" cols="3" rows="10" required></textarea> </div> </div> <div class="row top bot"> <div class="col-sm-12"> <input type="hidden" name="recaptcha-response" id="recaptchaResponse"> <button type="submit" id="info" name="info" class="btn btn-success">Envoyer</button> </div> </div> </form>
mon code js:
$('#wp').submit(function (e) { //$("#info").click(function (e) { console.log('dans le submit'); // e.preventDefault(); grecaptcha.ready(function() { grecaptcha.execute('xxxxxxxxxxxxxxx-BkSmwyUktum', {action: 'submit'}).then(function(token) { document.getElementById("recaptchaResponse").value = token; // Valeur des variables let type = document.getElementById("typew").value; let hebergementw = document.getElementById("hebergementw").value; let nonw = document.getElementById("nonw").value; let emailw = document.getElementById("emailw").value; let phonew = document.getElementById("phonew").value; let messagew = document.getElementById("messagew").value; let sujetw = document.getElementById("sujetw").value; // $("#wp").submit(function(r){ $.ajax({ type: "POST", url: "mail/mail.php", data: { token: token, type: type, hebergementw: hebergementw, nonw: nonw, emailw: emailw, phonew: phonew, messagew: messagew, sujetw: sujetw }, dataType: "JSON", }) .done(function(retour){ retour = JSON.parse(retour) console.log("Valeur de captcha sur wordpress : "+retour.success) if(retour.success == true){ $.ajax({ type: "POST", url: "mail/envoi-mail-wordpress.php", data: { type: type, hebergementw: hebergementw, nonw: nonw, emailw: emailw, phonew: phonew, messagew: messagew, sujetw: sujetw }, dataType: "JSON", }) .done(function(resp){ // $resp = $resp.JSON.parse; console.log('valeur de resp : '+resp) if(resp == true){ $('#nokw').hide(1000); $('#okw').show(1000); console.log("dans le if done : "+resp); }else{ $('#okw').hide(1000); $('#nokw').show(1000); } }) .fail(function(e){ console.log(e.responseText); }) }else { $('#nokw').show(1000) } }) .fail(function(e){ console.error(e.responseText); }); // }); }); }); //}); })
Le js du recaptcha:
<?php $TO = 'obierti.com'; // Sender Info $name = $_POST['name']; $email = $_POST['email']; $subject = $_POST['subject']; $message = $_POST['message']; $token = $_POST['token']; $url ="https://www.google.com/recaptcha/api/siteverify?secret=xxxxxxxxxxxxxxxxxxxxxx&response=$token"; $curl = curl_init($url); curl_setopt($curl, CURLOPT_HEADER, false); curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); curl_setopt($curl, CURLOPT_TIMEOUT, 1); curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false); $response = curl_exec($curl); echo json_encode($response); ?>Le probleme que je rencontre est que le formulaire n'est pas envoyé.Pouvez vous m'aider s'il vous plait ?
Le résultat que j'aimerai obtenir estg que
Vous pouvez rédiger votre message en Markdown ou en HTML uniquement.