[AJAX] Transmissions de champs form entre popup et page apelante

**mickado** · 02/02/2008, 12h28

Bonjour a tous !

J'ai un petit probléme que je n'arrive pas a résoudre seul, c'est pourquoi je vous demande a l'aide.

J'ai un formulaire d'édition de page web dans lequel l'internaute doit choisire une option dans une popup apellée par ce meme formulaire et cette option(valeur) doit être retourner dans un champ type TEXT du formulaire de ma page apellante, seulement je n'y arrive pas, j'ai essayer diverse méthode pour enfin y arriver mais en vain...

Pour vous donner une petite idée voici le code de ma page formulaire qui appel le Popup :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<HTML><HEAD><TITLE>Formulaire qui appelle mon popup</TITLE>
<SCRIPT type="text/JavaScript">
 
function OuvrirPopup(page,nom,option) {
  window.open(page,nom,option);
}
 
 
</SCRIPT></HEAD>
<body>
 
<FORM name='modcoul'>
	Votre choix <INPUT type="text" name="choix"><BR>
	<INPUT type="button" value="Ouvrir le popup" onClick="OuvrirPopup('popchoix.html')"><BR>
</FORM>
 
<BR>
<BR>
<BR>
<BR>
<BR>
</FONT>
</BODY></HTML>

et voici le code de ma popup :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<HTML><HEAD><TITLE>Popup de choix</TITLE>
 
<SCRIPT language="javascript">
 
// fonction à placer dans la popup, biensur. 
function popUpToOpener(popupFormName, popupFieldName, openerFormName, openerFieldName){
 
// on recupere le champ du formulaire de la popup 
var popupField = document.popupFormName.popupFieldName;
 
// le champ de la fenetre opener 
var openerField = window.opener.openerFormName.openerFieldName;
 
// et on fait passer la valeur du popupField, dans l'openerField 
openerField.value = popupField.value;
 
}
 
 
bloc = true;
function hexa(couleur)
{
	if(bloc)
		document.form.hexval.value = couleur;
}
function palette() { 
document.write("<TABLE border='0' cellpadding='0' cellspacing='0' ><TR>"); 
var h=new Array('00','33','66','99','CC','FF'); 
var col=""; 
for(var i=0;i<6;i++) { 
for(var j=0;j<6;j++) { 
for(var k=0;k<6;k++) { 
col="#"+h[i]+h[j]+h[k]; 
document.write("<TD width='10' height='10' bgcolor='"+col+"' onMouseOver=\"hexa('"+col+"')\" onClick=\"if(bloc) { bloc = false; } else { bloc = true; }\"></TD>"); 
} 
} 
document.write("</tr>"); 
} 
document.write("</TABLE>"); 
} 
</SCRIPT> 
</HEAD>
<body>
<div align="center">
<SCRIPT language="JavaScript"> 
palette(); 
</SCRIPT>
<form name="form">
Cliquez sur la couleur de votre choix pour désactiver/activer le défilement.<br />
<input type="text" name="hexval" size="9"><br>
<input type="submit" onclick="javascript:popUpToOpener('form', 'hexval', 'modcoul', 'choix')"  value="Envoyer">
</form>
</div>
 
</BODY></HTML>

En éspérant que vous puissez vous, trouver l'erreur que j'ai pus commettre.

Merci beaucoup .

**mickado** · 03/02/2008, 12h19

A croire que personne ne connais l'origine de mon probléme ...

**fayred** · 03/02/2008, 14h13

Bonjour,

as-tu essayé de te servir des id des champs plutôt que name et de recuperer ces champs via la foonction javascript getElementById("idDuChamp")?

Ps : Ton second message était-il vraiment nécessaire...?

**mickado** · 03/02/2008, 15h22

Envoyé par fayred

Bonjour,

as-tu essayé de te servir des id des champs plutôt que name et de recuperer ces champs via la foonction javascript getElementById("idDuChamp")?

Ps : Ton second message était-il vraiment nécessaire...?

A vraie dire, non je suis plustot tourner vers PHP, L'AJAX est tout nouveau pour moi et je n'est pas un niveau EXTRA en javascript.

Mon message n'était pas vraiment utile, je suis trop impatient cela fais trop longtemps que je me creuse le cerveau sur cette fonction sans pour autant savoir en tirer quelque chose de concret.

Je vais me renseigner sur la fonction que tu cite plus haut.

Merci bien

EDIT:

En effet getElementById() me semble plus approprié mais comment employer cette fonction ?

**mickado** · 03/02/2008, 16h58

J'ai enfin réussi

Nouveau probléme, une fois que l'internaute a choisis ça couleur je souhaiterais colorier du text sur ma page formulaire avec la couleur qu'il a choisis dans la popup, comment faire ?

merci.

**fayred** · 03/02/2008, 18h23

Je pense que tu dois pouvoir le faire en chargeant ta page contenant le texte avec une variable en get par exemple contenant ta couleur puis en mélangeant attribut style de tes balises html et variables php contenant la couleur.

Au vu de ce que tu me donnes comme code, c'est tout ce que je peux te dire...

**mickado** · 03/02/2008, 20h00

Envoyé par fayred

Je pense que tu dois pouvoir le faire en chargeant ta page contenant le texte avec une variable en get par exemple contenant ta couleur puis en mélangeant attribut style de tes balises html et variables php contenant la couleur.

Au vu de ce que tu me donnes comme code, c'est tout ce que je peux te dire...

je comprends bien et c'est d'ailleurs la premiére idée qui m'est venu mais justement, la page apellante ne dois pas être rechargée...

**fayred** · 03/02/2008, 20h49

Une solution consiste a submit ton formulaire avec de l'ajax et à recharger uniquement le div contenant le texte à modifier via la fonction javascript innerHTML().

[AJAX] Transmissions de champs form entre popup et page apelante

JavaScript

Discussions similaires

Partager

Partager