Formulaire : changer de page apr�s avoir valid�

**shaynee** · 19/01/2007, 14h59

Salut,
Je d�bute comme vous allez le voir (!) et j'ai bien cherch� mais je ne trouve pas comment rediriger le visiteur sur une autre page une fois qu'il a rempli mon formulaire... pour qu'il constate que tout a fonctionn�.

J'ai bien fait en sorte que les champs soient test�s et que �a me soit envoy� par mail quand on clique sur SUBMIT, �a fonctionne. Mais pour l'instant, pas de feedback pour le visiteur...

Je pense � une instruction du type : window.location="newpage.asp";

Mais o� et comment l'int�grer au script ?

SVP aidez-moi... je s�che ! [/B]
PS : je pr�cise que je n'ai pas mis d'instructions sur le bouton "submit" pour que l'envoi du form par mail fonctionne m�me si l'utilisateur a d�sactiv� javascript...

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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
 
<html>
<head>
 
<script type="text/JavaScript">
 
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
 
function MM_validateForm() { //v4.0
  var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
  for (i=0; i<(args.length-2); i+=3) { 
  test=args[i+2]; val=MM_findObj(args[i]);
 
	if (val) { 
		nm=val.name; 
 
		if ((val=val.value)!="") {	
			if (test.indexOf('isEmail')!=-1) { 
			p=val.indexOf('@');
       		if (p<1 || p==(val.length-1)) errors+='- '+nm+' : ce champ doit contenir un e-mail\n';
 
	  		} else if (test!='R') { 
 
			num = parseFloat(val);
        	if (isNaN(val)) errors+='- '+nm+' : ce champ doit contenir un code postal\n';
        	if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
          	min=test.substring(8,p); max=test.substring(p+1);
          	if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
 
			} 
			} 
			} 
 
		else if (test.charAt(0) == 'R') errors += '- '+nm+' : ce champ doit être renseigné\n'; 
		}
  		} 
 
  if (errors) 
  alert('Merci de compléter tous les champs obligatoires !\n\n'+errors);
  document.MM_returnValue = (errors == '');
  }  
  }
 
</script>
</head>
 
 
<body>
 
<form action="mailto:[email protected]?subject=Titre de la demande" method="post" enctype="text/plain" name="abo" 
onSubmit="MM_validateForm('nom','','R','prenom','','R','societe','','R','fonction','','R','Code Postal','','RisNum','ville','','R','pays','','R','E-mail','','RisEmail','adresse','','R','activite','','R'); return document.MM_returnValue; ">
  <table width="520" cellspacing="1" border="0">
    <tr>
      <td colspan="2" align="center">
      		<p><input type="checkbox" name="En francais" value="oui"> En fran&ccedil;ais
      			&nbsp;&nbsp;&nbsp;&nbsp;
      			<input type="checkbox" name="En anglais" value="oui"> En anglais</p>
      	</td>
    </tr>
    <tr>
      <td colspan="2">
        <p>&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" value="M." checked name="civilite">M.&nbsp;&nbsp;&nbsp;&nbsp;
        	<input type="radio" value="Mme" name="civilite">Mme&nbsp;&nbsp;&nbsp;&nbsp; 
        	<input type="radio" value="Mlle" name="mmm">Mlle</p>
		</td>
    </tr>
    <tr height="30">
      <td width="160" align="right"><p class="gras">Nom*&nbsp;</p></td>
      <td width="360"><input type="text" name="nom" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Pr&eacute;nom*&nbsp;</p></td>
      <td ><input type="text" name="prenom" size="50"></td>
    </tr>
 
    <tr height="30">
      <td align="right"><p class="gras">Soci&eacute;t&eacute;*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="societe" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Fonction*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="fonction" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right" valign="top"><p class="gras">Adresse*&nbsp;&nbsp;</p></td>
      <td><textarea rows="4" name="adresse" cols="45"></textarea></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Code postal*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="Code Postal" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Ville*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="ville" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Pays*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="pays" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">E-mail*&nbsp;&nbsp;</td>
      <td><input type="text" name="E-mail" size="50"></td>
    </tr>
	<tr height="30">
      <td align="right"><p class="gras">Tél.&nbsp;&nbsp;</td>
      <td><input type="text" name="tel" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right" valign="top"><p class="gras">Domaine&nbsp;&nbsp; d'activit&eacute;*</p></td>
      <td><textarea rows="5" name="activite" cols="45"></textarea></td>
    </tr>
    <tr>
      <td><p>* champs obligatoires</p></td>
    </tr>
    <tr>
      <td colspan="2" align="center">
      <input type="submit" value="S'abonner" name="Envoyer" class="gras">
      &nbsp;&nbsp;&nbsp;<input type="reset" value="Annuler" name="Annuler" class="gras"></td>
    </tr>
  </table>
</form>
 
</body>
</html>

**shaynee** · 19/01/2007, 16h32

Suis-je si mauvaise...

M�me pas un d�but de piste pour m'aider ?

**ryan** · 19/01/2007, 16h50

Yop!

Je sais que cela ne r�soudra pas ton pb, mais � premi�re vue, on dirait qu'il y a une parenth�se } en trop � la fin de la fonction MM_validateForm(), juste avant </script>.

Ne recois-tu pas de message d'erreur quand tu visualises la page?

**shaynee** · 19/01/2007, 17h19

h�h�...

merci, en fait non je n'ai pas eu de mess d'erreur mais je vais l'enlever on ne sait jamais...

j'avoue qu'� force de tenter des trucs je ne sais plus bien ce que j'ai touch� dans le code !

**ryan** · 19/01/2007, 17h26

Yop!

Ch'uis � la bourre, donc je vais faire vite.

Voici une autre version de ton code. Chez moi, �a ne fonctionne pas, je pense que mon courrierleur ne supporte pas le mailto. Mais j'ai ajout� un alert('foo') l� o� devrait �tre la redirection. Si le formulaire est bien compl�t�, et si tu vois le alert('foo') apr�s que le mail soit parti, on aura d�j� fait un grand pas.

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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
 
<html>
<head>
 
<script type="text/JavaScript">
 
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
 
function MM_validateForm() { //v4.0
  var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
  for (i=0; i<(args.length-2); i+=3) { 
  test=args[i+2]; val=MM_findObj(args[i]);
 
	if (val) { 
		nm=val.name; 
 
		if ((val=val.value)!="") {	
			if (test.indexOf('isEmail')!=-1) { 
			p=val.indexOf('@');
       		if (p<1 || p==(val.length-1)) errors+='- '+nm+' : ce champ doit contenir un e-mail\n';
 
	  		} else if (test!='R') { 
 
			num = parseFloat(val);
        	if (isNaN(val)) errors+='- '+nm+' : ce champ doit contenir un code postal\n';
        	if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
          	min=test.substring(8,p); max=test.substring(p+1);
          	if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
 
			} 
			} 
			} 
 
		else if (test.charAt(0) == 'R') errors += '- '+nm+' : ce champ doit être renseigné\n'; 
		}
  		} 
 
  if (errors) 
  {
  alert('Merci de compléter tous les champs obligatoires !\n\n'+errors);
  return false;
  }
  else return true;
 
}  
 
 
</script>
</head>
 
 
<body>
 
<form action="mailto:[email protected]?subject=Titre de la demande" method="post" enctype="text/plain" name="abo" 
onSubmit="return MM_validateForm('nom','','R','prenom','','R','societe','','R','fonction','','R','Code Postal','','RisNum','ville','','R','pays','','R','E-mail','','RisEmail','adresse','','R','activite','','R');alert('foo'); ">
  <table width="520" cellspacing="1" border="0">
    <tr>
      <td colspan="2" align="center">
      		<p><input type="checkbox" name="En francais" value="oui"> En fran&ccedil;ais
      			&nbsp;&nbsp;&nbsp;&nbsp;
      			<input type="checkbox" name="En anglais" value="oui"> En anglais</p>
      	</td>
    </tr>
    <tr>
      <td colspan="2">
        <p>&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" value="M." checked name="civilite">M.&nbsp;&nbsp;&nbsp;&nbsp;
        	<input type="radio" value="Mme" name="civilite">Mme&nbsp;&nbsp;&nbsp;&nbsp; 
        	<input type="radio" value="Mlle" name="mmm">Mlle</p>
		</td>
    </tr>
    <tr height="30">
      <td width="160" align="right"><p class="gras">Nom*&nbsp;</p></td>
      <td width="360"><input type="text" name="nom" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Pr&eacute;nom*&nbsp;</p></td>
      <td ><input type="text" name="prenom" size="50"></td>
    </tr>
 
    <tr height="30">
      <td align="right"><p class="gras">Soci&eacute;t&eacute;*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="societe" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Fonction*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="fonction" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right" valign="top"><p class="gras">Adresse*&nbsp;&nbsp;</p></td>
      <td><textarea rows="4" name="adresse" cols="45"></textarea></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Code postal*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="Code Postal" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Ville*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="ville" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Pays*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="pays" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">E-mail*&nbsp;&nbsp;</td>
      <td><input type="text" name="E-mail" size="50"></td>
    </tr>
	<tr height="30">
      <td align="right"><p class="gras">Tél.&nbsp;&nbsp;</td>
      <td><input type="text" name="tel" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right" valign="top"><p class="gras">Domaine&nbsp;&nbsp; d'activit&eacute;*</p></td>
      <td><textarea rows="5" name="activite" cols="45"></textarea></td>
    </tr>
    <tr>
      <td><p>* champs obligatoires</p></td>
    </tr>
    <tr>
      <td colspan="2" align="center">
      <input type="submit" value="S'abonner" name="Envoyer" class="gras">
      &nbsp;&nbsp;&nbsp;<input type="reset" value="Annuler" name="Annuler" class="gras"></td>
    </tr>
  </table>
</form>
 
</body>
</html>

**shaynee** · 19/01/2007, 17h35

Merci de ton aide Ryan, surtout que t'�tais � la bourre.
C'�tait bien tent� en plus mais... �a marche p�

En fait, le form se v�rifie toujours sans soucis, le mail s'ouvre et peut s'envoyer, etc.
Mais apr�s il ne se passe rien, la page du form reste affich�e quoi

D'autres id�es dans la salle ?

**ryan** · 19/01/2007, 19h29

Yop!

Je suis de retour, un peu cass�, mais de retour.
As-tu vu le alert('foo') apr�s que le mail soit parti?
Si oui, il suffit de remplacer le alert('foo') par la redirection et le tour devrait �tre jou�.

**ryan** · 19/01/2007, 22h49

Yop!

Voil�, il suffit de remplacer 'une_autre_page.html' dans la fonction vamos() par la page que tu veux afficher apr�s l'envoi du mail.

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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
 
<html>
<head>
 
<script type="text/JavaScript">
 
var sent = 0;
 
function vamos()
{
if (sent == 1) document.location.href='une_autre_page.html';	
}
 
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
 
function MM_validateForm() { //v4.0
  var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
  for (i=0; i<(args.length-2); i+=3) { 
  test=args[i+2]; val=MM_findObj(args[i]);
 
	if (val) { 
		nm=val.name; 
 
		if ((val=val.value)!="") {	
			if (test.indexOf('isEmail')!=-1) { 
			p=val.indexOf('@');
       		if (p<1 || p==(val.length-1)) errors+='- '+nm+' : ce champ doit contenir un e-mail\n';
 
	  		} else if (test!='R') { 
 
			num = parseFloat(val);
        	if (isNaN(val)) errors+='- '+nm+' : ce champ doit contenir un code postal\n';
        	if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
          	min=test.substring(8,p); max=test.substring(p+1);
          	if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
 
			} 
			} 
			} 
 
		else if (test.charAt(0) == 'R') errors += '- '+nm+' : ce champ doit être renseigné\n'; 
		}
  		} 
 
  if (errors) 
  {
  alert('Merci de compléter tous les champs obligatoires !\n\n'+errors);
  return false;
  }
  else 
  {
  sent = 1;	  
  return true;
  }
}  
 
 
</script>
</head>
 
 
<body onFocus="vamos()">
 
<form action="mailto:[email protected]?subject=Titre de la demande;" method="post" enctype="text/plain" name="abo" onSubmit="return MM_validateForm('nom','','R','prenom','','R','societe','','R','fonction','','R','Code Postal','','RisNum','ville','','R','pays','','R','E-mail','','RisEmail','adresse','','R','activite','','R');">
  <table width="520" cellspacing="1" border="0">
    <tr>
      <td colspan="2" align="center">
      		<p><input type="checkbox" name="En francais" value="oui"> En fran&ccedil;ais
      			&nbsp;&nbsp;&nbsp;&nbsp;
      			<input type="checkbox" name="En anglais" value="oui"> En anglais</p>
      	</td>
    </tr>
    <tr>
      <td colspan="2">
        <p>&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" value="M." checked name="civilite">M.&nbsp;&nbsp;&nbsp;&nbsp;
        	<input type="radio" value="Mme" name="civilite">Mme&nbsp;&nbsp;&nbsp;&nbsp; 
        	<input type="radio" value="Mlle" name="mmm">Mlle</p>
		</td>
    </tr>
    <tr height="30">
      <td width="160" align="right"><p class="gras">Nom*&nbsp;</p></td>
      <td width="360"><input type="text" name="nom" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Pr&eacute;nom*&nbsp;</p></td>
      <td ><input type="text" name="prenom" size="50"></td>
    </tr>
 
    <tr height="30">
      <td align="right"><p class="gras">Soci&eacute;t&eacute;*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="societe" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Fonction*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="fonction" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right" valign="top"><p class="gras">Adresse*&nbsp;&nbsp;</p></td>
      <td><textarea rows="4" name="adresse" cols="45"></textarea></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Code postal*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="Code Postal" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Ville*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="ville" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">Pays*&nbsp;&nbsp;</p></td>
      <td><input type="text" name="pays" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right"><p class="gras">E-mail*&nbsp;&nbsp;</td>
      <td><input type="text" name="E-mail" size="50"></td>
    </tr>
	<tr height="30">
      <td align="right"><p class="gras">Tél.&nbsp;&nbsp;</td>
      <td><input type="text" name="tel" size="50"></td>
    </tr>
    <tr height="30">
      <td align="right" valign="top"><p class="gras">Domaine&nbsp;&nbsp; d'activit&eacute;*</p></td>
      <td><textarea rows="5" name="activite" cols="45"></textarea></td>
    </tr>
    <tr>
      <td><p>* champs obligatoires</p></td>
    </tr>
    <tr>
      <td colspan="2" align="center">
      <input type="submit" value="S'abonner" name="Envoyer" class="gras">
      &nbsp;&nbsp;&nbsp;<input type="reset" value="Annuler" name="Annuler" class="gras"></td>
    </tr>
  </table>
</form>
 
</body>
</html>

**shaynee** · 23/01/2007, 10h38

Salut Ryan,

D�sol�e de pas avoir r�pondu plus vite, je viens juste de voir ta r�ponse !

Excellent ton script, �a marche !!!
Exactement ce que je voulais faire, en plus j'ai bien capt� la logique, �a va me permettre de faire des progr�s, c'est cool.

Je conseille ce script � tous ceux qui veulent faire une redirection propre sans fen�tres "alert" qui font peur au visiteur

Merci Ryan, trop sympa et �a me donne envie de s'y mettre � fond pour coder en Javascript comme une pro !

Formulaire : changer de page apr�s avoir valid�

JavaScript

Discussions similaires

Partager

Partager