Forum d'entraide PHPFrance

Bonjour,
Je suis en train de faire un formulaire qui s'ouvre sous forme d'un popup. Je ne l'ai pas ajouté mais il permettra d'envoyer la lettre d'info aux abonnés qui ont coché la case.
Le souci lorsque je clique sur s'inscrire le popup ne se ferme pas car je ne sais pas comment y intégrer window.top.close() et setTimeout et je souhaiterais également enregistrer les données dans ma bdd.
Comment ajouter l'url qui est en charge d'ajouter le contact dans ma table?

Le code en JS, il est sur ma pageA.php
[javascript]
<script type="text/javascript">
function validateEmail(email) {
var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return reg.test(email);
}

$(document).ready(function() {
$(".modalbox").fancybox();
$("#contact").submit(function() { return false; });
$("#send").on("click", function(){
var emailval = $("#email").val();
var mailvalid = validateEmail(emailval);

if(mailvalid == false) {
$("#email").addClass("error");
}
else if(mailvalid == true){
$("#email").removeClass("error");
}

if(mailvalid == true) {
$("#send").replaceWith("En cours...");
//Je souhaiterais ajouter ici la redirection sur la page pageB.php sous forme d'une fonction de redirection, est-ce possible?
}
});
});
</script>
[/javascript]

Et mon formulaire: pageA.php

<label>Recevoir news</label>
	<!--Création du formulaire-->
	<div id="wrapper">
	<p><a class="modalbox" href="#inline">S'inscrire à la lettre</a></p>
</div>

<!-- hidden inline form -->
<div id="inline">
	<form id="contact" name="contact" action="#" method="post">
		<label for="nom">Votre nom</label>
		<input type="text" id="nom" name="nom" class="txt">
		<br/>
		<label for="prenom">Votre prenom</label>
		<input type="text" id="prenom" name="prenom" class="txt">
		<br/>
		<label for="email">Votre e-mail</label>
		<input type="email" id="email" name="email" class="txt">
		<br/>
		
		<button id="send">S'inscrire</button>
	</form>
</div>

La page d'insertion en php sur laquelle je voudrais rediriger les éléments du form, page A par ex.

<?php
require_once('Connect.php');
$nom=$_POST['nom'];
$prenom=$_POST['prenom'];
$mail=$_POST['email'];
 
$requete="INSERT INTO abonnes(nom,prenom,adEmail) VALUES(:nom,:prenom,:adEmail)";
$prepa=$bdd->prepare($requete); 
$resultat=$prepa->execute(array(
				  ':nom'=>$nom,
				  ':prenom'=>$prenom,
				  ':adEmail'=>$mail,
	)); 
}
?>

Sur ma pageA.php, j'ai 2 formulaires. Peut-être est-ce incompatible?

Dans ce contexte, il est certain que je ne peux remplir ma table. Si quelqu'un a un conseil que je puisse faire fonctionner ce form.
Merci par avance
Ionesco

Salut,

Il n'y a pas beaucoup de solution, vu que tu empêche le us lit il faut que tu fasse la soumission en js (donc requête Ajax).

Ce que je me demande c'est : pourquoi ce code n'est pas simplement dans la gestion du submit form plutôt que sur la gestion du clic bouton ?
Tu remplace le bouton par un submit et déplace ton code dans la gestion du submit formulaire.
Dans ce cas tu met l'action vers la page b.
Si la validation se passe bien tu retourne troué sinon false (ce qui empêchera le submit comme tu le sais déjà


Ensuite côté code pourquoi un else if sur mail valid elle peux retourner autre chose qu'un booléen ta fonction ?
Et même si c'est le cas tu fait un

[javascript]
var emailval =
var mailvalid = validateEmail(emailval);

if( validateEmail( $("#email").val()) == true ) {
// validation des autres champs + return true quand tous est bon
}
else {
// addclass error etc
return false;
}
[/javascript]

Dans ce cas tu n'as pas besoin de te compliquer la vie.

Si Pagé BB n'est appelée que la popup tu ajoute a la fin un bout de javascript pour la fermeture de la pop up (window.close()).
Attention si tu utilise une modale c'est différente tu doit tout faire en js (donc requête Ajax obligatoire pour la soumission du formulaire et la clôture de la modale se fait dans le onsuccess de la requête Ajax.

@+

Bonjour Moogli,
Merci pour ta réponse. Dans ma page, j'ai déjà un submit. Problème. C'est pourquoi je voulais mettre ce formulaire en popup (j'aurais pu faire classique et rediriger sur une page B avec un formulaire et insérer les éléments des champs dans la bdd).
Je débute tout juste et je ne connais pas bien Ajax. J'avais un script en Ajax dans mon js mais il ne fonctionnait pas. J'ai donc voulu essayé de faire autrement mais d'après ta réponse, il faut absolument de l'Ajax.
Peux-tu me dire pourquoi mon code ne fonctionne pas? A savoir ma pageB est au même niveau que ma pageA (arborescence). J'ai un dossier (fancybox) qui contient les éléments de la modale.

Voici mon script modifié en Js et Ajax:
PS: je n'ai souhaité vérifier que l'e-mail. Je devrais peut-être rajouter des require pour nom et prénom.
J'ai aussi des checkbox.

[javascript]
<script type="text/javascript">
function validateEmail(email) {
var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return reg.test(email);
}

$(document).ready(function() {
$(".modalbox").fancybox();
$("#contact").submit(function() { return false; });
$("#send").on("click", function(){
var emailval = $("#email").val();
var mailvalid = validateEmail(emailval);

if(mailvalid == false) {
$("#email").addClass("error");
}
else if(mailvalid == true){
$("#email").removeClass("error");
}

if(mailvalid == true) {
$("#send").replaceWith("En cours...");

//Ce script ne parvient pas à envoyer les infos sélectionnées et à les analyser dans ma pageB.php. J'ai mis un var_dump($_POST) sur cette page et rien. Rien ne s'affiche. Après "En cours" (juste au-dessus, nada).
$.ajax({
type: 'POST',
url: 'pageB.php',
data: $("#contact").serialize(),
success: function(data) {
if(data == "true") {
$("#contact").fadeOut("fast", function(){
$(this).before("<p><strong>Message</strong></p>");
setTimeout("$.fancybox.close()", 1000);
});
}
}
});
}
});
});
[/javascript]

Je ne sais pas pourquoi il ne connecte pas à la pageB. Si tu as une explication?
La fenêtre ne se ferme pas non plus.
PS: que signifie les " le us lit".
Cdlt,
Ionesco

Pour le ps : c'est à cause de la p**** de correction automatique de la tablette (il fallait lire submit, je ne vois pas bien le rapport mais bon des fois faut pas chercher ).

Pour le code il faudrait que je test mais la je ne peux pas.

Ce que je te conseil c'est un e commérer par virer le super flux. C'est à dire le test sur l'expression régulière ou le retour de la requête.

Tu met jute la requête dans le traitement du formulaire et ferme la fenêtre dans le success.
Lorsque cela fonctionne tu peux ajouter la validation des champs de formulaire.
Pour faire une modale il me semble que jqueryui le propose (composant dialog je crois)

Ajoute les cas d'erreurs pour avoir des infos sur ce qui se passe. Tu peux aussi debugger le js (avec chrome par exemple).

@+

Bonjour Moogli,
Merci pour cette réponse. Cependant, je dois avouer que je n'ai pas tout compris. Le code est pour moi encore bien complexe, je ne suis pas en mesure d'y apporter de modifications. Je suis pressé par le temps car je dois finir ledit site. Je vais dans un premier temps opter pour une solution plus basique et revenir un peu plus tard sur le formulaire en JS et Ajax (que je ne connais que très peu). A suivre donc.

PS: je n'ai pas saisi le sens de cette phrase:

Ce que je te conseil c'est un e commérer par virer le super flux. C'est à dire le test sur l'expression régulière ou le retour de la requête.

Cdlt,
Ionesco