11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Voici ce que je veux faire : depuis ma page01.php je clique sur un lien qui ouvre un popup. Ce popup comporte un formulaire. Une fois qu'on envoi le formulaire, le popup se ferme et les données sont récupérées par la page "mère", à savoir page01.php.

Mes problèmes :
- je ne sais pas comment fermer le popup une fois les données envoyées.
- une fois les données envoyées la navigation continue dans ce popup au lieu de retourner sur la page01.php (il doit maquer un _parent ou quelque chose dans le genre).

Code du popup :
<form name="formCat" method="post" action="page01.php">
    <input type="radio" name="categories" value="01">Sport
    <input type="radio" name="categories" value="02">Loisirs
    <input type="radio" name="categories" value="03">Ciné
    <input type="radio" name="categories" value="01">Resto
    <input type="submit" value="Envoyer" id="btnEnvoyer" />
</form>


Code de ma page01.php :
if (isset($_POST['categorie'])) {
	$cat=$_POST['categorie'];
} 

echo '<p>La nouvelle catégorie est : '.$cat;.'</p>';


Quelqu'un aurait une idée de ce que je dois faire ?
Merci
Bonjour.

On peut utiliser l'évennement onsubmit :

<form name="formCat" method="post" action="page01.php" onsubmit="self.close()">


Néanmoins, le message php ne s'affichera pas, vu que la fenêtre sera fermée.
Pour envoyé les données à la fenêtre mere, il faut poster les valeurs dans cette fenetre.
Ainsi, peut être qu'il faudrait utiliser opener.location.href et envoyé ton formulaire en GET la dessus...
salut,

Tu peux soumettre ton formulaire puis le fermer dans la foulée en passant à ce popup une variable qui lui permettra de savoir si la page a déjà été soumise ou non (i.e. appelée depuis la page mère ou non):
1. Pour ouvir le popup, tu auras une URL de ce type :
mapageavecmonform.php?soumis=false
2. Dans ton formulaire, tu ajoutes un input de type hidden, avec comme valeur pour l'attribut "name", la valeur "soumis" et comme valeur pour l'attribut "value" la valeur "true".
3. dans le onload de ton body de ta page mapageavecmonform.php, tu récupères la valeur du "soumis" et tu teste sa valeur : s'il est à false, tu ne fais rien. S'il est à true, tu fais un window.close().

A présent, le passage des valeurs du formulaire du poup vers la page mère :
4. Pour lancer la soumission de ton formulaire, tu utilises un input de type "button" et pas "submit" (pour éviter une dble soumission)
5. sur l'évenement onClick de ton "button" tu appelles une fonction javascript de ton cru où tu vas coder :
5.1. l'affectation des paramètres de ton formulaire à ta page mère (des input là aussi ?) via l'objet window.opener
5.2. la soumission de ton formulaire : this.document.lenomdetonform.submit();

Voilà, c'est tout.
Modifié par naudjf (29 Sep 2006 - 16:18)
naudjf a écrit :
salut,

Tu peux soumettre ton formulaire puis le fermer dans la foulée en passant à ce popup une variable qui lui permettra de savoir si la page a déjà été soumise ou non (i.e. appelée depuis la page mère ou non):
1. Pour ouvir le popup, tu auras une URL de ce type :
mapageavecmonform.php?soumis=false
2. Dans ton formulaire, tu ajoutes un input de type hidden, avec comme valeur pour l'attribut "name", la valeur "soumis" et comme valeur pour l'attribut "value" la valeur "true".
3. dans le onload de ton body de ta page mapageavecmonform.php, tu récupères la valeur du "soumis" et tu teste sa valeur : s'il est à false, tu ne fais rien. S'il est à true, tu fais un window.close().


Que ce que ca apporte plutot que de faire simplement self:close() a la fin du traitement de son formulaire ? C'est se compliqué la vie pour rien..

naudjf a écrit :

4. Pour lancer la soumission de ton formulaire, tu utilises un input de type "button" et pas "submit" (pour éviter une dble soumission)


La double soumission peut être eviter en retournant false par la fonction appelé lors de l'envois
Modifié par nORKy (29 Sep 2006 - 16:59)
bonjour nORKy !

1.2.3 woops, je ne connaissais pas ce "self:close()" Smiley cligne !

4. l'ajout du bon vieux "return false;" ça marche mais...ça sent la bidouille ! Je reste sur l"idée que le type button convient mieux dans ce cas !

Pas de remarques sur 5. ? Cété bien alors...? Smiley cligne

A+
naudjf a écrit :


Pas de remarques sur 5. ? Cété bien alors...? Smiley cligne

A+


Ca te gène que j'ai pas penché pour les mêmes idées que toi ???
Et le bonjour, pourquoi il est en gras ? dans 10min, tu pourras le changer en bonsoir si tu veux.

Maintenant, si tu veux des remarques, je ne peux pas en faire. Par contre je peux te faire des suggestions comme je l'ai fait avant. Le but est de partager des techniques, pas de faire des remarques.
Si j'ai bien compris, tu veux un remplir un formulaire invisible sur la page mere et l'envoyer. Moi je proposer de faire un GET dans la page mere :
- on recupere les données du formulaire
- on serialise tout ca : c1=val1&c2=val2
- on fait le GET dans la page mere : opener.location.href=monlien?c1=val1&c2=val2
- on se ferme self.close();

Peut etre qu'il y a d'autres solutions