empêcher l'enregistrement dans ma bdd de données non valides

**Claudine** · 17/05/2011, 19h11

Bonsoir ABCIWEB,
Désolé de vous importuner une fois de plus.Toujours le même problème!
"Si je complète le formulaire avec des données valables, dès que je clic sur envoyer, il me réaffiche le formulaire remplis avec les données introduites précédemment et si je clique une fois de plus sur envoyer rien ne se passe(il garde toutes les données entrées)et, mais il reste bloqué sur ce formulaire."Donc impossible de l'envoyer sur une autre page .
J'espère de bien me faire comprendre.
Bien à vous
Claudine

**ABCIWEB** · 17/05/2011, 21h33

Pff... une erreur idiote d'inattention de ma part (parce qu'un moment j'ai mélangé un peu avec javascript)
Ce n'est pas

Code :

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

1
2
    if ($message && count($message) == 0)
        {//...

Mais

Code :

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

1
2
    if (isset($message) && count($message) == 0)
        {//...

(je n'ai pas pu éditer mon précédent message)

Donc si tes données sont correctes selle seront enregistrées dans ta bdd et à la suite tu auras une redirection vers le fichier "ChampVVM.php"

**Claudine** · 19/05/2011, 10h22

Bonjour ABCIWEB
Génial et parfait ce code!
J'aimerais apporter un plus à mon formulaire d'inscription actuel ci-dessous:

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>NouvForm.php</title>
</head>
 
<body>
<p>
<TD>Veuillez compléter ce formulaire </TD>
</p>
 
 <form action="Majuscules2.php" method="post">
 <TR>
	<TD>Catégories</TD>
	<TD>
	<SELECT name="Catégories">
		<OPTION VALUE="metiers">Métiers</OPTION>
		<OPTION VALUE="services">Services</OPTION>
		<OPTION VALUE="particuliers">Particuliers</OPTION>
		<OPTION VALUE="maison">Maison</OPTION>
		<OPTION VALUE="jardin">Jardin</OPTION>
		<OPTION VALUE="commerce">Commerce</OPTION>
		<OPTION VALUE="divers">Divers</OPTION>
	</SELECT>
	</TD>
 
 
	<p>
        <label for="fonction">Fonction :</label>
 
         <input type="text" id="fonction" name="fonction" 
 
 
        />
    </p>
<p>
        <label for="nom"> Nom :</label>
 
         <input type="text" id="nom" name="nom" 
 
 
        />
    </p>
    <p>
        <label for="prenom"> Prénom :</label>
        <input type="text" id="prenom" name="prenom" 
 
        />
    <p>
        <label for="numtel"> N°de téléphone :</label>
        <input type="text" id="numtel" name="numtel" 
 
        />
    </p>
 
 
 <input type="submit" name = "envoyer" value="Envoyer" />
</p>
</form>
</body>
</html>

Au champ"Fonction", j'aimerais faire apparaître des listes déroulantes en fonction du choix de la liste déroulante "Catégories"
Ainsi donc si je clic 'Métiers', j'aimerais qu'apparaisse une liste déroulante avec différents choix: horticulteur,plombier, électricien,boulanger
Si par contre je clic'Jardin': une autre liste déroulante avec comme choix: entreprise de jardin, taille des haies, entretien de pelouses
En résumé faire apparaitre une liste déroulante différente dans le champ"Fonction" selon le choix de la catégorie.
Est-ce réalisable (en php ou...)?
Puis-je compter une fois de plus sur votre aide?
Sincères remerciements
Claudine

**ABCIWEB** · 19/05/2011, 19h54

Tes listes liées n'ont pas l'air très longues donc ce sera très adapté avec l'avantage que le contenu des listes pourra être référencé puisque c'est du html géré par du javascript (testes le code entier du tuto dans une page séparée pour commencer).

**Claudine** · 23/05/2011, 10h47

Bonjour ABCIWEB
Le petit tuto est en effet très adapté et je vous en remercie.J'ai testé le code entier du tuto dans une page séparée pour commencer et puis je l'ai adapté à la bdd (sans les sessions) où vous avez contribuer largement à son élaboration. Tout fonctionne à merveille si ce n'est le problème suivant:
Est-ce l'élaboration de ce formulaire en css ou je ne sais quoi...... mais j'ai depuis un problème au niveau de l'enregistrement dans la bdd où je n'arrive plus à enregistrer les noms ou autres dès qu'il y a un accent (signes bizarre qui remplace cette lettres) et par conséquence dès que je fais une requête de sélection, il n'affiche pas ces lignes.
Pouvez-vous m'aider à résoudre ce problème?
A toute fins utiles, je me permets de joindre le formulaire:

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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Listes liées HTML JAVASCRIPT</title>
 
<script type="text/javascript">
<!--
function Affiche_liste(id_ensemble_select,id_select)
{
        // Sélection du bloc contenant les sélections liées (id = "categorie" dans notre exemple)
        var id_ensemble_select = document.getElementById(id_ensemble_select);
 
        // Sélection de la sélection liée
        var id_select = document.getElementById(id_select);
 
        if(id_ensemble_select && id_select)
                {
                        //Initialisation d'une variable pour contenir un tableau.
                        var tab = new Array();
 
                        // Cherche les balises select inlues dans le bloc (id = "categorie" dans notre exemple) contenant les sélections liées  et les retourne dans un tableau
                        tab = id_ensemble_select.getElementsByTagName('select');
 
                        // Liste les éléments du tableau
                        for (i=0; i < tab.length; i++)        
                                        {
                                                // Met les selects en disable = true et les cache avec style.display = 'none'
                                                tab[i].disabled = true;
                                                tab[i].style.display = 'none';
                                        }
 
                        // Met la sélection liée sélectionné en disable = false et l'affiche avec style.display = 'inline'          
                        id_select.disabled = false;
                        id_select.style.display = 'inline';
 
                }
}
 
-->
</script>
<style type="text/css">
 
#categorie
{
        height:0.5em;
}
 
#categorie select
{
        display:none;
}
 
</style>
 
</head>
 
<body>
 
<div style="width:40em;margin:auto; border:1px solid black;padding:1em">
<form action="tutochampVVMPost.php" method="post">
       //  <form action = "#" method = "post">
  Cochez une des catégories ci-dessous:              
                <p>
                        <label for="choix_catégories">Metiers</label>
                        <input type="radio" id = "choix_catégories" name = "cat" value = "Metiers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
                        <label for="choix_catégories">Particuliers</label>
                        <input type="radio" id = "choix_catégories" name = "cat" value = "Particuliers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
                        <label for="choix_catégories">Jardins</label>
                         <input type="radio" id = "choix_catégories" name = "cat" value = "Jardins" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
                       <label for="choix_catégories">Commerces</label>
                        <input type="radio" id = "choix_catégories" name = "cat" value = "Commerces" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" /> 
						 <label for="choix_catégories">Maisons</label>
                        <input type="radio" id = "choix_catégories" name = "cat" value = "Maisons" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
						 <label for="choix_catégories">Services</label>
                        <input type="radio" id = "choix_catégories" name = "cat" value = "Services" class = "categorie" onclick = "Affiche_liste(this.className,this.value)"/>
 
                         <label for="choix_catégories">Societes</label>				 
                        <input type="radio" id = "choix_catégories" name = "cat" value = "Sociétés" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />                                                                     
                <!--
                        <select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
                           <option value = "">«Choisissez»</option>
                           <option value = "Metiers">Metiers</option>
                           <option value = "Particuliers">Particuliers</option>
                           <option value = "Jardins">Jardins</option>
                           <option value = "Commerces">Commerces</option>  
						   <option value = "Maisons">Maisons</option>
						   <option value = "Services">Services</option>
						   <option value = "Societes">Societes</option>       
                        </select>
                -->
                </p>
 
 
                <p style="font-style:italic">La liste déroulante ci-dessous s'affichera en fonction de votre choix ci-dessus :</p>
 
                <p id = "categorie">     
                        <select name = "selection" id = "Metiers">
 
 
                           <option value = "">«Choisissez»</option>
                           <option value = "Horticulteur">Horticulteur</option>
                           <option value = "Plombier">Plombier</option>
                           <option value = "Electricien">Electricien</option>
						   <option value = "Boulanger">Boulanger</option>        
                        </select>
 
 
                        <select name = "selection" id = "Particuliers">
 
                           <option value = "">«Choisissez»</option>
                           <option value = "Vente maison">Vente maison</option>
                           <option value = "Location maison">Location maison</option>
                           <option value = "Vente objet divers">Vente objet divers</option>
						   <option value = "Proposition de services">Proposition de services</option>
 
 
                        </select>
 
 
                        <select name = "selection" id = "Jardins">
 
                           <option value = "">«Choisissez»</option>
                           <option value = "EntrepriseJardin">EntrepriseJardin</option>
                           <option value = "Taille des haies">Tailles des haies</option>
                           <option value = "Pavage carrelage terrasse">Pavage carrelage terrasse</option>
 
                     </select>
 
				   <select name = "selection" id = "Commerces">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Vente cadeaux">Vente cadeaux</option>
                   <option value = "Fleurs artificielles">Fleurs artificielles</option>
				   <option value = "Plantes vivaces">Plantes vivaces</option>
                  <option value = "Couronnes mortuaires">Couronnes mortuaires</option>
 
                        </select>
 
					<select name = "selection" id = "Maisons">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Décoration">Décoration</option>
                   <option value = "Peintre">Peintre</option>
				   <option value = "Tapissier">Tapissier</option>
                  <option value = "Renovation">Renovation</option>
 
                        </select>	
						<select name = "selection" id = "Services">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Decoration">Decoration</option>
                   <option value = "Peintre">Peintre</option>
				   <option value = "Tapissier">Tapissier</option>
                  <option value = "Renovation">Renovation</option>
 
                        </select>	
						<select name = "selection" id = "Societes">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Decoration">Decoration</option>
                   <option value = "Peintre">Peintre</option>
				   <option value = "Tapissier">Tapissier</option>
                  <option value = "Renovation">Renovation</option>
 
                        </select>	
           </p>        
<p>
        <label for="nom"> Nom :</label>
 
         <input type="text" id="nom" name="nom" 
 
 
 
        />
    </p>
    <p>
        <label for="prenom"> Prénom :</label>
        <input type="text" id="prenom" name="prenom" 
 
        />
    <p>
        <label for="numtel"> N°de téléphone :</label>
        <input type="text" id="numtel" name="numtel" 
 
        />
    </p>
 
     <p>
        <label for="codepostal"> Votre code postal :</label>
        <input type="text" size="4" maxlength="4" id="codepostal" name="codepostal" 
    //    <input name="nbr" type="text" size="4" minlength= "4" maxlength="4"  
 
        />
    </p>       
 
		 <p>
        <label for="ville"> Ville </label>
        <input type="text" id="ville" name="ville" 
 
        />
    </p>
 
           <br />
           <input name = "envoyer" value = "Envoyer" type = "submit"/>
                </p>
        </form>
 
</div>
 
</body>
</html>

Si par hasard vous aviez besoin de"tutochampVVMPost.php" je vous le poste
Sincères remerciements
Claudine

**Nheo_** · 23/05/2011, 10h51

Bonjour,

Cela vient sûrement de l'encodage de ta page (ici UTF8).

Essaye de mettre ceci avant l'insertion dans la base de données :

Code :

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

mysql_query("SET NAMES UTF8");

**ABCIWEB** · 23/05/2011, 19h59

Nheo_ a sans doute raison. Le tuto est en utf-8 et si ton code original est en iso cela provoque ce genre de problème.

Plutôt que de passer en utf-8 ce qui n'est pas le problème pour l'instant j'ai remis un encodage iso-8859-1 et corriger quelques fautes dans ton code. Notamment en html un id doit être identique, et puis les formulaires imbriqués ça n'existe 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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<title>Listes li&eacute;es HTML JAVASCRIPT</title>
 
<script type="text/javascript">
<!--
function Affiche_liste(id_ensemble_select,id_select)
{
        // Sélection du bloc contenant les sélections liées (id = "categorie" dans notre exemple)
        var id_ensemble_select = document.getElementById(id_ensemble_select);
 
        // Sélection de la sélection liée
        var id_select = document.getElementById(id_select);
 
        if(id_ensemble_select && id_select)
                {
                        //Initialisation d'une variable pour contenir un tableau.
                        var tab = new Array();
 
                        // Cherche les balises select inlues dans le bloc (id = "categorie" dans notre exemple) contenant les sélections liées  et les retourne dans un tableau
                        tab = id_ensemble_select.getElementsByTagName('select');
 
                        // Liste les éléments du tableau
                        for (i=0; i < tab.length; i++)        
                                        {
                                                // Met les selects en disable = true et les cache avec style.display = 'none'
                                                tab[i].disabled = true;
                                                tab[i].style.display = 'none';
                                        }
 
                        // Met la sélection liée sélectionné en disable = false et l'affiche avec style.display = 'inline'          
                        id_select.disabled = false;
                        id_select.style.display = 'inline';
 
                }
}
 
-->
</script>
<style type="text/css">
 
#categorie
{
        height:0.5em;
}
 
#categorie select
{
        display:none;
}
 
</style>
 
</head>
 
<body>
 
<div style="width:45em;margin:auto; border:1px solid black;padding:1em">
<form action="#" method="post">
 
  Cochez une des cat&eacute;gories ci-dessous:              
                <div>
					<p>
							<label for="metier">Metiers</label>
							<input type="radio" id = "metier" name = "cat" value = "Metiers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
							<label for="particulier">Particuliers</label>
							<input type="radio" id = "particulier" name = "cat" value = "Particuliers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
							<label for="jardin">Jardins</label>
							 <input type="radio" id = "jardin" name = "cat" value = "Jardins" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
						   <label for="commerce">Commerces</label>
							<input type="radio" id = "commerce" name = "cat" value = "Commerces" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" /> 
							 <label for="maison">Maisons</label>
							<input type="radio" id = "maison" name = "cat" value = "Maisons" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
							 <label for="service">Services</label>
							<input type="radio" id = "service" name = "cat" value = "Services" class = "categorie" onclick = "Affiche_liste(this.className,this.value)"/>
 
							 <label for="societes">Societes</label>				 
							<input type="radio" id = "societes" name = "cat" value = "Societes" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />                                                                     
					<!--
							<select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
							   <option value = "">«Choisissez»</option>
							   <option value = "Metiers">Metiers</option>
							   <option value = "Particuliers">Particuliers</option>
							   <option value = "Jardins">Jardins</option>
							   <option value = "Commerces">Commerces</option>  
							   <option value = "Maisons">Maisons</option>
							   <option value = "Services">Services</option>
							   <option value = "Societes">Societes</option>       
							</select>
					-->
					</p>
 
 
 
 
					<p id = "categorie">     
							<select name = "selection" id = "Metiers" style="display:block;" disabled="disabled" > 
 
 
							   <option value = "">«Choisissez»</option>
							   <option value = "Horticulteur">Horticulteur</option>
							   <option value = "Plombier">Plombier</option>
							   <option value = "Electricien">Electricien</option>
							   <option value = "Boulanger">Boulanger</option>        
							</select>
 
 
							<select name = "selection" id = "Particuliers">
 
							   <option value = "">«Choisissez»</option>
							   <option value = "Vente maison">Vente maison</option>
							   <option value = "Location maison">Location maison</option>
							   <option value = "Vente objet divers">Vente objet divers</option>
							   <option value = "Proposition de services">Proposition de services</option>
 
 
							</select>
 
 
							<select name = "selection" id = "Jardins">
 
							   <option value = "">«Choisissez»</option>
							   <option value = "EntrepriseJardin">EntrepriseJardin</option>
							   <option value = "Taille des haies">Tailles des haies</option>
							   <option value = "Pavage carrelage terrasse">Pavage carrelage terrasse</option>
 
						 </select>
 
					   <select name = "selection" id = "Commerces">
 
					   <option value = "">«Choisissez»</option>
					   <option value = "Vente cadeaux">Vente cadeaux</option>
					   <option value = "Fleurs artificielles">Fleurs artificielles</option>
					   <option value = "Plantes vivaces">Plantes vivaces</option>
					  <option value = "Couronnes mortuaires">Couronnes mortuaires</option>
 
							</select>
 
						<select name = "selection" id = "Maisons">
 
					   <option value = "">«Choisissez»</option>
					   <option value = "Décoration">D&eacute;coration</option>
					   <option value = "Peintre">Peintre</option>
					   <option value = "Tapissier">Tapissier</option>
					  <option value = "Renovation">Renovation</option>
 
							</select>	
							<select name = "selection" id = "Services">
 
					   <option value = "">«Choisissez»</option>
					   <option value = "Decoration">Decoration</option>
					   <option value = "Peintre">Peintre</option>
					   <option value = "Tapissier">Tapissier</option>
					  <option value = "Renovation">Renovation</option>
 
							</select>	
							<select name = "selection" id = "Societes">
 
					   <option value = "">«Choisissez»</option>
					   <option value = "Decoration">Decoration</option>
					   <option value = "Peintre">Peintre</option>
					   <option value = "Tapissier">Tapissier</option>
					  <option value = "Renovation">Renovation</option>
 
							</select>	
			   </p>   
		   </div>   
	<div  style="margin-top:2em">  
	<p>
        <label for="nom"> Nom :</label>
 
         <input type="text" id="nom" name="nom" />
    </p>
    <p>
        <label for="prenom"> Pr&eacute;nom :</label>
        <input type="text" id="prenom" name="prenom" />
	</p>
    <p>
        <label for="numtel"> N&deg;de t&eacute;l&eacute;phone :</label>
        <input type="text" id="numtel" name="numtel" />
    </p>
 
     <p>
        <label for="codepostal"> Votre code postal :</label>
 
       <input name="nbr" type="text" size="4" minlength= "4" maxlength="4"  
 
        />
    </p>       
 
		 <p>
        <label for="ville"> Ville </label>
        <input type="text" id="ville" name="ville" 
 
        />
    </p>
		  <p>
 
           <input name = "envoyer" value = "Envoyer" type = "submit"/>
          </p>
		  </div>
</form>
 
</div>
 
</body>
</html>

par rapport au tuto, j'ai affiché un select de la seconde liste en grisé dès le départ mais il ne peut être utilisé que lorsque l'on a fait un choix.
Bon je te laisse poursuivre pour intégrer le reste du code.

**Claudine** · 26/05/2011, 16h53

Bonjour ABCIWEB,
C'est un plaisir de constater le bien fondé de toute vos remarques ce qui me permet de progresser . Mais que veut dire la ligne en gras?

Code :

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

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />

Tout fonctionne et s'enregistre maintenant correctement dans la bdd. Cependant, il y a (à mon avis) un petit problème que j'ai essayé de résoudre depuis 2 jours, mais.....sans solutions. A savoir:
au niveau de l'affichage des messages dans le formulaire
Si je coche la catégorie et une sélection et directement envoyer il devrait logiquement m'afficher tout les messages (compléter ceci et ........)or il n'affiche que: indiquer votre nom?
De même lorsque je coche la catégorie , une sélection et le nom pour envoyer le tout :il indique uniquement indiquer votre prénom
Cependant si je coche la catégorie, la sélection ,le nom et prénom et envoyer le tout, il m'affiche tout le reste des message à compléter : numtel, Codepostal, ville. Pouvez-vous me conseiller pour résoudre cette anomalie?
Ci-joint l'ensemble formulaire+code:

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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
 
<title>Listes li&eacute;es HTML JAVASCRIPT</title>
 
<script type="text/javascript">
<!--
function Affiche_liste(id_ensemble_select,id_select)
{
        // Sélection du bloc contenant les sélections liées (id = "categorie" dans notre exemple)
        var id_ensemble_select = document.getElementById(id_ensemble_select);
 
        // Sélection de la sélection liée
        var id_select = document.getElementById(id_select);
 
        if(id_ensemble_select && id_select)
                {
                        //Initialisation d'une variable pour contenir un tableau.
                        var tab = new Array();
 
                        // Cherche les balises select inlues dans le bloc (id = "categorie" dans notre exemple) contenant les sélections liées  et les retourne dans un tableau
                        tab = id_ensemble_select.getElementsByTagName('select');
 
                        // Liste les éléments du tableau
                        for (i=0; i < tab.length; i++)        
                                        {
                                                // Met les selects en disable = true et les cache avec style.display = 'none'
                                                tab[i].disabled = true;
                                                tab[i].style.display = 'none';
                                        }
 
                        // Met la sélection liée sélectionné en disable = false et l'affiche avec style.display = 'inline'          
                        id_select.disabled = false;
                        id_select.style.display = 'inline';
 
                }
}
 
-->
</script>
<style type="text/css">
 
#categorie
{
        height:0.5em;
}
 
#categorie select
{
        display:none;
}
 
</style>
 
</head>
 
<body>
<?php
 
$message = array();
 
 
if (isset($_POST['envoyer']))
 
{
 
    /* Récupération des valeurs des champs du formulaire */
    if (get_magic_quotes_gpc())
    {
 
      $cat     	= stripslashes(trim($_POST['cat']));
 
      $selection		= stripslashes(trim($_POST['selection']));
      $nom	     	= stripslashes(trim($_POST['nom']));
 
      $prenom		= stripslashes(trim($_POST['prenom']));
      $numtel	= stripslashes(trim($_POST['numtel']));
      $codepostal	= stripslashes(trim($_POST['codepostal']));
	  $ville	= stripslashes(trim($_POST['ville']));
 
    }
       else
       {
 
           $cat        = trim($_POST['cat']);
 
           $selection	    = trim($_POST['selection']);
		    $nom	        = trim($_POST['nom']);
    // $nom=ucfirst($nom);
           $prenom	    = trim($_POST['prenom']);
	 //$prenom=ucfirst($prenom);
	 	   $numtel      = trim($_POST['numtel']);
           $codepostal      = trim($_POST['codepostal']);
		   $ville     = trim($_POST['ville']);
 
		}   
		   if (!(isset($_POST['cat']) && trim($_POST['cat']) != ''))
	    {
		     $message[] = 'Veuillez cocher un bouton';
		}  
 
		 if (!(isset($_POST['selection']) && trim($_POST['selection']) != ''))
	    {
		     $message[] = 'Veuillez cliquer une sélection';
	    }  
 
	   //....	   
	    if (!(isset($_POST['nom']) && trim($_POST['nom']) != ''))
	    {
		     $message[] = 'Veuillez indiquer votre nom';
	    }
         else    
        {
 
	      if (! preg_match('#^[a-zéèàçïêë]{3,12}$#i',$nom))	 
	         {
	              $message[] = 'Le ' . $_POST['nom'] . ' n\'est pas                   valide, recommencez !';   
 
             }
 
//......
 
 
         if (!(isset($_POST['prenom']) && trim($_POST['prenom']) != ''            ))
	      {
		            $message[] = 'Veuillez indiquer votre prénom';
	      }
	        else    
          { 
 
	               if (! preg_match('#^[a-zéèàçïêë]{3,12}$#i',$prenom))	 
	         {
	              $message[] = 'Le ' . $_POST['prenom'] . ' n\'autorise                  que des lettres, (au minimum 3) recommencez !'; 
			  }
 
 
 
//...
	      if (!(isset($_POST['numtel']) && trim($_POST['numtel']) != ''))	 
	      {
		      $message[] = 'Veuillez indiquer un numéro de téléphone';
	      }
	      else
	      {
		        if (!(preg_match("#^0[1-8]([-. ]?[0-9]{2}){4}$#", $_POST              ['numtel']) || preg_match("#^0[1-8]([-. ]?[0-9]{1}){7}$#",              $_POST['numtel'])))
		      {
			       $message[] = 'Le ' . $_POST['numtel'] . ' n\'est pas                    valide, recommencez !';   
		      }
	      }
 
//...	
 
 
			  if (!(isset($_POST['codepostal']) && trim($_POST['codepostal']) != ''))
	    {
		     $message[] = 'Veuillez indiquer le code postal';
 
 
 
			 }
	        else    
 
 
	             //  if (! preg_match( ( 0-9 )$codepostal ))-> rend numérique;                 
	               if (! preg_match('#^[0-9]{4,4}$#i',$codepostal))	 
	         {
	              $message[] = 'Le ' . $_POST['codepostal'] . ' n\'autorise                  que des chiffres et au nombre de 4, recommencez !'; 
			  }
 
			// remplacer (/ [^ 0-9 ]/,'') -> rend numérique; 
 
	if (!(isset($_POST['ville']) && trim($_POST['ville']) != ''))
	    {
		     $message[] = 'Veuillez indiquer la ville';
		}	 
 
 
			 }
	    }
 
 
	       if (isset($message) && count($message) == 0)
	      {
 
//....
 
 
		       // Connexion à la base de données
		 try
			 {
			  $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
			  $bdd = new PDO('mysql:host=localhost;dbname=clients', 'root', '', $pdo_options);
 
			  // Insertion du message à l'aide d'une requête préparée
			  $req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');
			  // ucfirst($nom)=> Majuscule à la première lettre
			  $req->execute(array($_POST['cat'], $_POST['selection'],  $_POST['nom'],  $_POST['prenom'], $_POST['numtel'], $_POST['codepostal'], $_POST['ville'] ));
			  // Redirection du visiteur vers la page duformulaire//
 
				header('Location:Index.html');
			 }
		catch(Exception $e)
		   	 {
				die('Erreur : '.$e->getMessage());
		   	 }
}
}
 
 
?>
<form method="post">
 
  <strong>  <em>Cochez une des cat&eacute;gories ci-dessous: </em></strong>             
  <p>
                        <label for="metier">Métiers</label>
                        <input type="radio" id = "metier" name = "cat" value = "Métiers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
                        <label for="particulier">Particuliers</label>
                        <input type="radio" id = "particulier" name = "cat" value = "Particuliers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
                        <label for="jardin">Jardins</label>
                         <input type="radio" id = "cjardin" name = "cat" value = "Jardins" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
                       <label for="commerce">Commerces</label>
                        <input type="radio" id = "commerce" name = "cat" value = "Commerces" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" /> 
						 <label for="maison">Maisons</label>
                        <input type="radio" id = "maison" name = "cat" value = "Maisons" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
 
						 <label for="service">Services</label>
                        <input type="radio" id = "service" name = "cat" value = "Services" class = "categorie" onclick = "Affiche_liste(this.className,this.value)"/>
 
                         <label for="societes">Societes</label>				 
                        <input type="radio" id = "societes" name = "cat" value = "Sociétés" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />                                                                     
                <!--
                        <select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
                           <option value = "">«Choisissez»</option>
                           <option value = "Metiers">Metiers</option>
                           <option value = "Particuliers">Particuliers</option>
                           <option value = "Jardins">Jardins</option>
                           <option value = "Commerces">Commerces</option>  
						   <option value = "Maisons">Maisons</option>
						   <option value = "Services">Services</option>
						   <option value = "Societes">Societes</option>       
                        </select>
                -->
  </p>
 
 
                <p style="font-style:italic">La liste d&eacute;roulante ci-dessous s'affichera en fonction de votre choix ci-dessus :</p>
 
                <p id = "categorie">     
                        <select name = "selection" id = "Métiers">
 
 
                           <option value = "">«Choisissez»</option>
                           <option value = "Horticulteur">Horticulteur</option>
                           <option value = "Plombier">Plombier</option>
                           <option value = "Electricien">Electricien</option>
						   <option value = "Boulanger">Boulanger</option>        
                        </select>
 
 
                        <select name = "selection" id = "Particuliers">
 
                           <option value = "">«Choisissez»</option>
                           <option value = "Vente maison">Vente maison</option>
                           <option value = "Location maison">Location maison</option>
                           <option value = "Vente objet divers">Vente objet divers</option>
						   <option value = "Proposition de services">Proposition de services</option>
 
 
                        </select>
 
 
 
                        <select name = "selection" id = "Jardins">
 
                           <option value = "">«Choisissez»</option>
                           <option value = "EntrepriseJardin">EntrepriseJardin</option>
                           <option value = "Taille des haies">Tailles des haies</option>
                           <option value = "Pavage carrelage terrasse">Pavage carrelage terrasse</option>
 
                     </select>
 
				   <select name = "selection" id = "Commerces">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Vente cadeaux">Vente cadeaux</option>
                   <option value = "Fleurs artificielles">Fleurs artificielles</option>
				   <option value = "Plantes vivaces">Plantes vivaces</option>
                  <option value = "Couronnes mortuaires">Couronnes mortuaires</option>
 
                  </select>
 
					<select name = "selection" id = "Maisons">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Décoration">D&eacute;coration</option>
                   <option value = "Peintre">Peintre</option>
				   <option value = "Tapissier">Tapissier</option>
                  <option value = "Rénovation">R&eacute;novation</option>
 
                  </select>	
						<select name = "selection" id = "Services">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Decoration">Decoration</option>
                   <option value = "Peintre">Peintre</option>
				   <option value = "Tapissier">Tapissier</option>
                  <option value = "Renovation">Renovation</option>
 
                        </select>	
						<select name = "selection" id = "Societes">
 
                   <option value = "">«Choisissez»</option>
                   <option value = "Decoration">Decoration</option>
                   <option value = "Peintre">Peintre</option>
				   <option value = "Tapissier">Tapissier</option>
                  <option value = "Renovation">Renovation</option>
 
                        </select>	
           </p>        
    <p>
        <label for="nom">Votre nom :</label>
 
         <input type="text" id="nom" name="nom" 
 
        value="<?php echo (isset($_POST['nom'])) ?$nom : '' ?>"  
 
        />
    </p>
    <p>
        <label for="prenom">Votre prenom :</label>
        <input type="text" id="prenom" name="prenom" 
        value="<?php echo (isset($_POST['prenom'])) ? $prenom : '' ?>" 
        />
    <p>
        <label for="numtel">Votre N&deg;de t&eacute;l&eacute;phone :</label>
        <input type="text" id="numtel" name="numtel" 
        value="<?php echo (isset($_POST['numtel'])) ? $numtel : '' ?>" 
        />
    </p>
 
     <p>
        <label for="codepostal">Votre code postal :</label>
 
		<input type="text" size="4" maxlength="4" id="codepostal" name="codepostal" 
        value="<?php echo (isset($_POST['codepostal'])) ? $codepostal : '' ?>" 
        />
    </p>
 
	<p>
        <label for="ville">Ville :</label>
        <input type="text" id="ville" name="ville" 
        value="<?php echo (isset($_POST['ville'])) ? $ville : '' ?>" 
        />
    </p>
 <input type="submit" name = "envoyer" value="Envoyer" />
</p>
</form>
<?php
if(isset($message) && count($message) > 0)
{
foreach($message as $value) echo '<p>'.$value.'</p>';
}
?> __________________
</body>
</html>

Merci mille fois ABCIWEB pour votre aide oh combien précieuse!
Merci à Nheo
Claudine

**ABCIWEB** · 26/05/2011, 18h11

Envoyé par Claudine

Bonjour ABCIWEB,
...mais que veut dire la ligne en gras?

Code :

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

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />

C'est justement ce qui indique l'encodage à utiliser, ici charset=iso-8859-1 (suffisant pour le français). Le tuto que tu as utilisé indiquait charset=utf-8 qui est recommandé puisqu'il est compatible multi langue mais pour que cela fonctionne il faut que les entêtes envoyées au serveur et les requêtes soient également à ce standard. Mais bon comme ce n'est pas ce qui nous intéresse actuellement, autant ne pas mélanger les problèmes et continuer en iso-8859-1 et si besoin passer en utf-8 ultérieurement (il y a un tuto ici).

Pour le reste je regarde et je te répondrai ultérieurement.

**ABCIWEB** · 26/05/2011, 23h46

Bon je suis reparti de mon précédent code. Cela donne ceci :

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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
<?php
if (!session_id()) session_start();//déclare l'ouverture d'une session si aucune n'a été déclarée auparavant.
 
 
if (isset($_POST['envoyer'])) 
{
 
    function Verif_magicquotes ($chaine)// fonctin qui applique stripslashes si get_magic_quotes_gpc() est activé
    {
		if (get_magic_quotes_gpc()) $chaine = stripslashes($chaine);
 
		return $chaine;
    } 
 
 
    $message = array();// Pour enregistrer les messages d'information
    $_SESSION['post_form']['message'] =& $message;// avec & on assigne $message à $_SESSION['post_form']['message'] c.a.d. tout changement dans $message sera répercuté dans $_SESSION['post_form']['message']
 
 
 	$_SESSION['post_form']['cat'] = $cat = isset($_POST['cat']) && trim($_POST['cat']) != '' ? Verif_magicquotes(trim($_POST['cat'])) : null;  
 
 	$_SESSION['post_form']['selection'] = $selection = isset($_POST['selection']) && trim($_POST['selection']) != '' ? Verif_magicquotes(trim($_POST['selection'])) : null;   
 
    $_SESSION['post_form']['nom'] = $nom = isset($_POST['nom']) && trim($_POST['nom']) != '' ? Verif_magicquotes(ucfirst(trim($_POST['nom']))) : null;//ucfirst pour convertir le première lettre en majuscule
 
    $_SESSION['post_form']['prenom'] = $prenom = isset($_POST['prenom']) && trim($_POST['prenom']) != '' ? Verif_magicquotes(ucfirst(trim($_POST['prenom']))) : null;//ucfirst pour convertir le première lettre en majuscule
 
    $_SESSION['post_form']['numtel'] = $numtel = isset($_POST['numtel']) && trim($_POST['numtel']) != '' ? Verif_magicquotes(trim($_POST['numtel'])) : null;
 
    $_SESSION['post_form']['codepostal'] = $codepostal = isset($_POST['codepostal']) && trim($_POST['codepostal']) != '' ? Verif_magicquotes(trim($_POST['codepostal'])) : null;
 
	$_SESSION['post_form']['ville'] = $ville = isset($_POST['ville']) && trim($_POST['ville']) != '' ? Verif_magicquotes(trim($_POST['ville'])) : null; 
 
 
 
	if (!isset($cat))
	    {
		     $message[] = 'Veuillez cocher un bouton pour la catégorie';
		}  
 
 
 
	if (!isset($selection))
	    {
		     $message[] = 'Veuillez choisir une option dans la liste déroulante';
		}  
 
 
 
    if (isset($nom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$nom))     
                {
                    $message[] = 'Le nom "'.$nom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }
        }
    else    
        {
             $message[] = 'Veuillez indiquer votre nom'; 
        }
 
 
 
    if (isset($prenom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$prenom)) 
                {
                    $message[] = 'Le prénom "'.$prenom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }  
        }
    else    
        { 
            $message[] = 'Veuillez indiquer votre prénom';
        }
 
 
 
    if (isset($numtel))     
        {
            if (!(preg_match("#^0[1-8]([-. ]?[0-9]{2}){4}$#", $numtel) || preg_match("#^0[1-8]([-. ]?[0-9]{1}){7}$#", $numtel)))
                {
                    $message[] = 'Le numéro de télélphone "'.$numtel.'" n\'est pas valide. Recommencez !';   
                }
        }
    else
        {
            $message[] = 'Veuillez indiquer un numéro de téléphone';        
        }
 
 
 
	if (isset($codepostal))
	    {
			if (! preg_match('#^[0-9]{4}$#',$codepostal)) 
                {		     
					$message[] = 'Le code postal doit être un nombre de 4 chiffres';
				}
		}
	else
		{
			$message[] = 'Veuillez indiquer le code postal';
		}  
 
 
 
	if (!isset($ville))
	    {
		     $message[] = 'Veuillez indiquer la ville';
		}  
 
 
 
    if (isset($message) && count($message) == 0)
        {
            //Effacement éventuel des variables de session (ou ne pas effacer si l'on veut garder les champs de formulaires remplis suite à une redirection sur cette même page)
            //unset($_SESSION['post_form']);
 
 
            // Connexion à la base de données
            try
                 {
					$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
					$bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options);
 
					// Insertion du message à l'aide d'une requête préparée
					$req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');                  
					$req->execute(array($cat, $selection, $nom, $prenom, $numtel, $codepostal, $ville));
 
					//redirection vers la page d'index
					header('Location: index.html');
					exit;
                 }
            catch(Exception $e)
                 {
                    die('Erreur : '.$e->getMessage());
                 }
        }
        else
        {
            header('Location: '.$_SERVER['PHP_SELF']);// redirige vers la page en cours en cas d'erreur (count($message) > 0)
            exit;
        }
}   
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<title>Listes li&eacute;es HTML JAVASCRIPT</title>
 
<script type="text/javascript">
<!--
function Affiche_liste(id_ensemble_select,id_select)
{
        // Sélection du bloc contenant les sélections liées (id = "categorie" dans notre exemple)
        var id_ensemble_select = document.getElementById(id_ensemble_select);
 
        // Sélection de la sélection liée
        var id_select = document.getElementById(id_select);
 
        if(id_ensemble_select && id_select)
                {
                        //Initialisation d'une variable pour contenir un tableau.
                        var tab = new Array();
 
                        // Cherche les balises select inlues dans le bloc (id = "categorie" dans notre exemple) contenant les sélections liées  et les retourne dans un tableau
                        tab = id_ensemble_select.getElementsByTagName('select');
 
						var tablength = tab.length;
 
                        // Liste les éléments du tableau
                        for (i=0; i < tablength; i++)        
                                        {
                                                // Met les selects en disable = true et les cache avec style.display = 'none'
                                                tab[i].disabled = true;
                                                tab[i].style.display = 'none';
                                        }
 
                        // Met la sélection liée sélectionné en disable = false et l'affiche avec style.display = 'inline'          
                        id_select.disabled = false;
                        id_select.style.display = 'inline';
 
                }
}
 
 
<?php  if (isset($_SESSION['post_form']['cat']))
 
{ ?>
// Affiche la liste sélectionnée et l'élément sélectionné au rechargement de la page
function Affiche_liste_selected(id_ensemble_select)
{
	//catégorie sélectionnée
	var selection = '<?php echo $_SESSION['post_form']['cat'] ?>';
 
	//sélection de l'élément, avec getElementById, de la catégorie sélectionnée
	var id_selection = document.getElementById(selection);
 
	if(id_selection)
		{ 
			// Appel à la fonction Affiche_liste pour afficher la sous catégorie correspondante et mettre les autres en disabled = true; 
			Affiche_liste(id_ensemble_select,selection);
 
			//Option sélectionnée
			var option = '<?php echo isset($_SESSION['post_form']['selection'])? $_SESSION['post_form']['selection'] : '' ?>';	
			var id_selectionlength = id_selection.length;
 
			//liste les éléments du tableau
			for (i=0; i < id_selectionlength; i++)        
					{
						// on regarde si l'option du select est égal à la variable $_SESSION['post_form']['selection']
						if (id_selection.options[i].value == option)
							{	
								// Si oui on le sélectionne
								id_selection.options[i].selected = true;		
							}
					}	
		}
}
 
 
// fonction générique permettant un appel aux fonctions javascript dès le chargement de la page.
function AddLoad_AFS(func) {
 
		if (window.addEventListener)
			{
				window.addEventListener("load", func, false);
			}
		else if (document.addEventListener)
			{
				document.addEventListener("load", func, false);
			}
		else if (window.attachEvent)
			{
				window.attachEvent("onload", func);
			}
}
 
// Appel à la fonction générique qui elle même appelle la fonction Affiche_liste_selected avec comme argument l'id du bloc contenant les sélections liées	
AddLoad_AFS(function(){Affiche_liste_selected('categorie')}); // ATTENTION DE BIEN PASSER EN PARAMETRE l'id du bloc contenant les sélections liées	
 
<?php } ?>
-->
</script>
<style type="text/css">
body
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
}
 
p, input, select, form, option 
{
	padding:0;
	margin:0;
}
 
#form_identification p
{
	padding:0.5em;
}
 
.categorie {
	width:1.2em;
	padding:0;
	margin-right: 1em;
}
 
#categorie
{
    height:1.5em;
}
 
#categorie select
{
    display:none;
}
 
</style>
 
</head>
 
<body>
 
<div style="width:48em;margin:auto; border:1px solid black;padding:1em">
	<form action="#" method="post" id = "form_identification">
 
		<p style="font-size:0.9em; font-style:italic">Cochez une des cat&eacute;gories ci-dessous, puis une option dans la liste qui s'affichera en fonction de votre choix : </p>
 
		<div>
			<p>
				<label for="metier">Metiers</label>
				<input type="radio" id = "metier" name = "cat" value = "Metiers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'checked = "checked"'; ?> />
 
				<label for="particulier">Particuliers</label>
				<input type="radio" id = "particulier" name = "cat" value = "Particuliers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'checked = "checked"'; ?> />
 
				<label for="jardin">Jardins</label>
				<input type="radio" id = "jardin" name = "cat" value = "Jardins" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'checked = "checked"'; ?> />
 
				<label for="commerce">Commerces</label>
				<input type="radio" id = "commerce" name = "cat" value = "Commerces" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'checked = "checked"'; ?> /> 
 
				<label for="maison">Maisons</label>
				<input type="radio" id = "maison" name = "cat" value = "Maisons" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'checked = "checked"'; ?> />
 
				<label for="service">Services</label>
				<input type="radio" id = "service" name = "cat" value = "Services" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Services") echo 'checked = "checked"'; ?> />
 
				<label for="societe">Societes</label>				 
				<input type="radio" id = "societe" name = "cat" value = "Societes" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Societes") echo 'checked = "checked"'; ?> />                                                                     
				<!--
				<select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
				<option value = "" >«Choisissez»</option>
				<option value = "Metiers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'selected = "selected"'; ?> >Metiers</option>
				<option value = "Particuliers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'selected = "selected"'; ?> >Particuliers</option>
				<option value = "Jardins" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'selected = "selected"'; ?> >Jardins</option>
				<option value = "Commerces" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'selected = "selected"'; ?> >Commerces</option>  
				<option value = "Maisons" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'selected = "selected"'; ?> >Maisons</option>
				<option value = "Services" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Services") echo 'selected = "selected"'; ?> >Services</option>
				<option value = "Societes" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Societes") echo 'selected = "selected"'; ?> >Societes</option>  
 
				</select>
				-->
			</p>
 
 
 
			<p id = "categorie">     
				<select name = "selection" id = "Metiers" style= "display:inline" disabled="disabled"> 
 
					<option value = "">«Choisissez»</option>
					<option value = "Horticulteur">Horticulteur</option>
					<option value = "Plombier">Plombier</option>
					<option value = "Electricien">Electricien</option>
					<option value = "Boulanger">Boulanger</option>        
 
				</select>
 
 
				<select name = "selection" id = "Particuliers">
 
					<option value = "">«Choisissez»</option>
					<option value = "Vente maison">Vente maison</option>
					<option value = "Location maison">Location maison</option>
					<option value = "Vente objet divers">Vente objet divers</option>
					<option value = "Proposition de services">Proposition de services</option>
 
				</select>
 
 
				<select name = "selection" id = "Jardins">
 
					<option value = "">«Choisissez»</option>
					<option value = "EntrepriseJardin">EntrepriseJardin</option>
					<option value = "Taille des haies">Tailles des haies</option>
					<option value = "Pavage carrelage terrasse">Pavage carrelage terrasse</option>
 
				</select>
 
 
				<select name = "selection" id = "Commerces">
 
					<option value = "">«Choisissez»</option>
					<option value = "Vente cadeaux">Vente cadeaux</option>
					<option value = "Fleurs artificielles">Fleurs artificielles</option>
					<option value = "Plantes vivaces">Plantes vivaces</option>
					<option value = "Couronnes mortuaires">Couronnes mortuaires</option>
 
				</select>
 
 
				<select name = "selection" id = "Maisons">
 
					<option value = "">«Choisissez»</option>
					<option value = "Décoration">D&eacute;coration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
 
 
				<select name = "selection" id = "Services">
 
					<option value = "">«Choisissez»</option>
					<option value = "Decoration">Decoration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
 
 
				<select name = "selection" id = "Societes">
 
					<option value = "">«Choisissez»</option>
					<option value = "Decoration">Decoration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
			</p>   
		</div> 
 
 
 
		<div  style="margin-top:2em">  
			<p>
				<label for="nom"> Nom :</label>
				<input type="text" id="nom" name="nom" value="<?php echo (isset($_SESSION['post_form']['nom'])) ? $_SESSION['post_form']['nom'] : '' ?>" />
			</p>
 
			<p>
				<label for="prenom"> Pr&eacute;nom :</label>
				<input type="text" id="prenom" name="prenom" value="<?php echo (isset($_SESSION['post_form']['prenom'])) ? $_SESSION['post_form']['prenom'] : '' ?>" />
			</p>
 
			<p>
				<label for="numtel"> N&deg;de t&eacute;l&eacute;phone :</label>
				<input type="text" id="numtel" name="numtel" value="<?php echo (isset($_SESSION['post_form']['numtel'])) ? $_SESSION['post_form']['numtel'] : '' ?>" />
			</p>
 
			<p>
				<label for="codepostal"> Votre code postal :</label>
				<input name="codepostal" id="codepostal" type="text" size="4" minlength= "4" maxlength="4" value="<?php echo (isset($_SESSION['post_form']['codepostal'])) ? $_SESSION['post_form']['codepostal'] : '' ?>" />
			</p>       
 
			<p>
				<label for="ville"> Ville :</label>
				<input type="text" id="ville" name="ville" value="<?php echo (isset($_SESSION['post_form']['ville'])) ? $_SESSION['post_form']['ville'] : '' ?>" />
			</p>
 
			<p style="margin-top:1.5em">
			<input name = "envoyer" value = "Envoyer" type = "submit"/>
			</p>
 
		</div>
	</form>
 
	<div style="font-size:0.8em; font-weight:bold">
	<?php
	if(isset($_SESSION['post_form']['message']) && count($_SESSION['post_form']['message']) > 0)
	{
		foreach($_SESSION['post_form']['message'] as $value) echo '<p>- '.$value.'</p>';
	}
	?>
	</div>
</div>
 
</body>
</html>

Y'avait "un peu" de javascript à ajouter pour garder les sélections en cours au rechargement de la page dans le cas où d'autres champs n'auraient pas été correctement remplis.

Le code est complet, à tester dans une page vierge.

**ABCIWEB** · 27/05/2011, 00h32

Au fait, je précise si besoin que dans le code ci-dessus - dans mon message précédent - le bloc :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
				<!--
				<select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
				<option value = "" >«Choisissez»</option>
				<option value = "Metiers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'selected = "selected"'; ?> >Metiers</option>
				<option value = "Particuliers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'selected = "selected"'; ?> >Particuliers</option>
				<option value = "Jardins" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'selected = "selected"'; ?> >Jardins</option>
				<option value = "Commerces" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'selected = "selected"'; ?> >Commerces</option>  
				<option value = "Maisons" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'selected = "selected"'; ?> >Maisons</option>
				<option value = "Services" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Services") echo 'selected = "selected"'; ?> >Services</option>
				<option value = "Societes" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Societes") echo 'selected = "selected"'; ?> >Societes</option>  
 
				</select>
				-->

... ne sert strictement à rien puisqu'il est entre commentaire ( pour le html). En fait il sert juste à se souvenir du formatage nécessaire pour avoir deux listes déroulantes plutôt qu'une liste de boutons radio + une liste déroulante.

Pour la forme je mets maintenant mes boutons radio en commentaire pour faire afficher deux listes :

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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
<?php
if (!session_id()) session_start();//déclare l'ouverture d'une session si aucune n'a été déclarée auparavant.
 
 
if (isset($_POST['envoyer'])) 
{
 
    function Verif_magicquotes ($chaine)// fonctin qui applique stripslashes si get_magic_quotes_gpc() est activé
    {
		if (get_magic_quotes_gpc()) $chaine = stripslashes($chaine);
 
		return $chaine;
    } 
 
 
    $message = array();// Pour enregistrer les messages d'information
    $_SESSION['post_form']['message'] =& $message;// avec & on assigne $message à $_SESSION['post_form']['message'] c.a.d. tout changement dans $message sera répercuté dans $_SESSION['post_form']['message']
 
 
 	$_SESSION['post_form']['cat'] = $cat = isset($_POST['cat']) && trim($_POST['cat']) != '' ? Verif_magicquotes(trim($_POST['cat'])) : null;  
 
 	$_SESSION['post_form']['selection'] = $selection = isset($_POST['selection']) && trim($_POST['selection']) != '' ? Verif_magicquotes(trim($_POST['selection'])) : null;   
 
    $_SESSION['post_form']['nom'] = $nom = isset($_POST['nom']) && trim($_POST['nom']) != '' ? Verif_magicquotes(ucfirst(trim($_POST['nom']))) : null;//ucfirst pour convertir le première lettre en majuscule
 
    $_SESSION['post_form']['prenom'] = $prenom = isset($_POST['prenom']) && trim($_POST['prenom']) != '' ? Verif_magicquotes(ucfirst(trim($_POST['prenom']))) : null;//ucfirst pour convertir le première lettre en majuscule
 
    $_SESSION['post_form']['numtel'] = $numtel = isset($_POST['numtel']) && trim($_POST['numtel']) != '' ? Verif_magicquotes(trim($_POST['numtel'])) : null;
 
    $_SESSION['post_form']['codepostal'] = $codepostal = isset($_POST['codepostal']) && trim($_POST['codepostal']) != '' ? Verif_magicquotes(trim($_POST['codepostal'])) : null;
 
	$_SESSION['post_form']['ville'] = $ville = isset($_POST['ville']) && trim($_POST['ville']) != '' ? Verif_magicquotes(trim($_POST['ville'])) : null; 
 
 
 
	if (!isset($cat))
	    {
		     $message[] = 'Veuillez choisir une catégorie';
		}  
 
 
 
	if (!isset($selection))
	    {
		     $message[] = 'Veuillez choisir une option dans la seconde liste déroulante';
		}  
 
 
 
    if (isset($nom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$nom))     
                {
                    $message[] = 'Le nom "'.$nom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }
        }
    else    
        {
             $message[] = 'Veuillez indiquer votre nom'; 
        }
 
 
 
    if (isset($prenom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$prenom)) 
                {
                    $message[] = 'Le prénom "'.$prenom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }  
        }
    else    
        { 
            $message[] = 'Veuillez indiquer votre prénom';
        }
 
 
 
    if (isset($numtel))     
        {
            if (!(preg_match("#^0[1-8]([-. ]?[0-9]{2}){4}$#", $numtel) || preg_match("#^0[1-8]([-. ]?[0-9]{1}){7}$#", $numtel)))
                {
                    $message[] = 'Le numéro de télélphone "'.$numtel.'" n\'est pas valide. Recommencez !';   
                }
        }
    else
        {
            $message[] = 'Veuillez indiquer un numéro de téléphone';        
        }
 
 
 
	if (isset($codepostal))
	    {
			if (! preg_match('#^[0-9]{4}$#',$codepostal)) 
                {		     
					$message[] = 'Le code postal doit être un nombre de 4 chiffres';
				}
		}
	else
		{
			$message[] = 'Veuillez indiquer le code postal';
		}  
 
 
 
	if (!isset($ville))
	    {
		     $message[] = 'Veuillez indiquer la ville';
		}  
 
 
 
    if (isset($message) && count($message) == 0)
        {
            //Effacement éventuel des variables de session (ou ne pas effacer si l'on veut garder les champs de formulaires remplis suite à une redirection sur cette même page)
            //unset($_SESSION['post_form']);
 
 
            // Connexion à la base de données
            try
                 {
					$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
					$bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options);
 
					// Insertion du message à l'aide d'une requête préparée
					$req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');                  
					$req->execute(array($cat, $selection, $nom, $prenom, $numtel, $codepostal, $ville));
 
					//redirection vers la page d'index
					header('Location: index.html');
					exit;
                 }
            catch(Exception $e)
                 {
                    die('Erreur : '.$e->getMessage());
                 }
        }
        else
        {
            header('Location: '.$_SERVER['PHP_SELF']);// redirige vers la page en cours en cas d'erreur (count($message) > 0)
            exit;
        }
}   
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<title>Listes li&eacute;es HTML JAVASCRIPT</title>
 
<script type="text/javascript">
<!--
function Affiche_liste(id_ensemble_select,id_select)
{
        // Sélection du bloc contenant les sélections liées (id = "categorie" dans notre exemple)
        var id_ensemble_select = document.getElementById(id_ensemble_select);
 
        // Sélection de la sélection liée
        var id_select = document.getElementById(id_select);
 
        if(id_ensemble_select && id_select)
                {
                        //Initialisation d'une variable pour contenir un tableau.
                        var tab = new Array();
 
                        // Cherche les balises select inlues dans le bloc (id = "categorie" dans notre exemple) contenant les sélections liées  et les retourne dans un tableau
                        tab = id_ensemble_select.getElementsByTagName('select');
 
						var tablength = tab.length;
 
                        // Liste les éléments du tableau
                        for (i=0; i < tablength; i++)        
                                        {
                                                // Met les selects en disable = true et les cache avec style.display = 'none'
                                                tab[i].disabled = true;
                                                tab[i].style.display = 'none';
                                        }
 
                        // Met la sélection liée sélectionné en disable = false et l'affiche avec style.display = 'inline'          
                        id_select.disabled = false;
                        id_select.style.display = 'inline';
 
                }
}
 
 
<?php  if (isset($_SESSION['post_form']['cat']))
 
{ ?>
// Affiche la liste sélectionnée et l'élément sélectionné au rechargement de la page
function Affiche_liste_selected(id_ensemble_select)
{
	//catégorie sélectionnée
	var selection = '<?php echo $_SESSION['post_form']['cat'] ?>';
 
	//sélection de l'élément, avec getElementById, de la catégorie sélectionnée
	var id_selection = document.getElementById(selection);
 
	if(id_selection)
		{ 
			// Appel à la fonction Affiche_liste pour afficher la sous catégorie correspondante et mettre les autres en disabled = true; 
			Affiche_liste(id_ensemble_select,selection);
 
			//Option sélectionnée
			var option = '<?php echo isset($_SESSION['post_form']['selection'])? $_SESSION['post_form']['selection'] : '' ?>';	
			var id_selectionlength = id_selection.length;
 
			//liste les éléments du tableau
			for (i=0; i < id_selectionlength; i++)        
					{
						// on regarde si l'option du select est égal à la variable $_POST["selection"]
						if (id_selection.options[i].value == option)
							{	
								// Si oui on le sélectionne
								id_selection.options[i].selected = true;		
							}
					}	
		}
}
 
 
// fonction générique permettant un appel aux fonctions javascript dès le chargement de la page.
function AddLoad_AFS(func) {
 
		if (window.addEventListener)
			{
				window.addEventListener("load", func, false);
			}
		else if (document.addEventListener)
			{
				document.addEventListener("load", func, false);
			}
		else if (window.attachEvent)
			{
				window.attachEvent("onload", func);
			}
}
 
// Appel à la fonction générique qui elle même appelle la fonction Affiche_liste_selected avec comme argument l'id du bloc contenant les sélections liées	
AddLoad_AFS(function(){Affiche_liste_selected('categorie')}); // ATTENTION DE BIEN PASSER EN PARAMETRE l'id du bloc contenant les sélections liées	
 
<?php } ?>
-->
</script>
<style type="text/css">
body
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
}
 
p, input, select, form, option 
{
	padding:0;
	margin:0;
}
 
#form_identification p
{
	padding:0.5em;
}
 
/*.categorie {
	width:1.2em;
	padding:0;
	margin-right: 1em;
}
*/
#categorie, #liste1
{
    height:1.5em;
	display:inline;
}
 
#categorie select
{
    display:none;
}
 
</style>
 
</head>
 
<body>
 
<div style="width:48em;margin:auto; border:1px solid black;padding:1em">
	<form action="#" method="post" id = "form_identification">
 
		<p style="font-size:0.9em; font-style:italic">Cochez une des cat&eacute;gories ci-dessous, puis une option dans la liste qui s'affichera en fonction de votre choix : </p>
 
		<div>
			<p id="liste1"><!--
				<label for="metier">Metiers</label>
				<input type="radio" id = "metier" name = "cat" value = "Metiers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'checked = "checked"'; ?> />
 
				<label for="particulier">Particuliers</label>
				<input type="radio" id = "particulier" name = "cat" value = "Particuliers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'checked = "checked"'; ?> />
 
				<label for="jardin">Jardins</label>
				<input type="radio" id = "jardin" name = "cat" value = "Jardins" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'checked = "checked"'; ?> />
 
				<label for="commerce">Commerces</label>
				<input type="radio" id = "commerce" name = "cat" value = "Commerces" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'checked = "checked"'; ?> /> 
 
				<label for="maison">Maisons</label>
				<input type="radio" id = "maison" name = "cat" value = "Maisons" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'checked = "checked"'; ?> />
 
				<label for="service">Services</label>
				<input type="radio" id = "service" name = "cat" value = "Services" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Services") echo 'checked = "checked"'; ?> />
 
				<label for="societe">Societes</label>				 
				<input type="radio" id = "societe" name = "cat" value = "Societes" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Societes") echo 'checked = "checked"'; ?> />   
              -->                                                    
 
				<select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
				<option value = "" >«Choisissez»</option>
				<option value = "Metiers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'selected = "selected"'; ?> >Metiers</option>
				<option value = "Particuliers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'selected = "selected"'; ?> >Particuliers</option>
				<option value = "Jardins" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'selected = "selected"'; ?> >Jardins</option>
				<option value = "Commerces" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'selected = "selected"'; ?> >Commerces</option>  
				<option value = "Maisons" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'selected = "selected"'; ?> >Maisons</option>
				<option value = "Services" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Services") echo 'selected = "selected"'; ?> >Services</option>
				<option value = "Societes" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Societes") echo 'selected = "selected"'; ?> >Societes</option>  
 
				</select>
 
			</p>
 
 
 
			<p id = "categorie">     
				<select name = "selection" id = "Metiers" style= "display:inline" disabled="disabled"> 
 
					<option value = "">«Choisissez»</option>
					<option value = "Horticulteur">Horticulteur</option>
					<option value = "Plombier">Plombier</option>
					<option value = "Electricien">Electricien</option>
					<option value = "Boulanger">Boulanger</option>        
 
				</select>
 
 
				<select name = "selection" id = "Particuliers">
 
					<option value = "">«Choisissez»</option>
					<option value = "Vente maison">Vente maison</option>
					<option value = "Location maison">Location maison</option>
					<option value = "Vente objet divers">Vente objet divers</option>
					<option value = "Proposition de services">Proposition de services</option>
 
				</select>
 
 
				<select name = "selection" id = "Jardins">
 
					<option value = "">«Choisissez»</option>
					<option value = "EntrepriseJardin">EntrepriseJardin</option>
					<option value = "Taille des haies">Tailles des haies</option>
					<option value = "Pavage carrelage terrasse">Pavage carrelage terrasse</option>
 
				</select>
 
 
				<select name = "selection" id = "Commerces">
 
					<option value = "">«Choisissez»</option>
					<option value = "Vente cadeaux">Vente cadeaux</option>
					<option value = "Fleurs artificielles">Fleurs artificielles</option>
					<option value = "Plantes vivaces">Plantes vivaces</option>
					<option value = "Couronnes mortuaires">Couronnes mortuaires</option>
 
				</select>
 
 
				<select name = "selection" id = "Maisons">
 
					<option value = "">«Choisissez»</option>
					<option value = "Décoration">D&eacute;coration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
 
 
				<select name = "selection" id = "Services">
 
					<option value = "">«Choisissez»</option>
					<option value = "Decoration">Decoration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
 
 
				<select name = "selection" id = "Societes">
 
					<option value = "">«Choisissez»</option>
					<option value = "Decoration">Decoration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
			</p>   
		</div> 
 
 
 
		<div  style="margin-top:2em">  
			<p>
				<label for="nom"> Nom :</label>
				<input type="text" id="nom" name="nom" value="<?php echo (isset($_SESSION['post_form']['nom'])) ? $_SESSION['post_form']['nom'] : '' ?>" />
			</p>
 
			<p>
				<label for="prenom"> Pr&eacute;nom :</label>
				<input type="text" id="prenom" name="prenom" value="<?php echo (isset($_SESSION['post_form']['prenom'])) ? $_SESSION['post_form']['prenom'] : '' ?>" />
			</p>
 
			<p>
				<label for="numtel"> N&deg;de t&eacute;l&eacute;phone :</label>
				<input type="text" id="numtel" name="numtel" value="<?php echo (isset($_SESSION['post_form']['numtel'])) ? $_SESSION['post_form']['numtel'] : '' ?>" />
			</p>
 
			<p>
				<label for="codepostal"> Votre code postal :</label>
				<input name="codepostal" id="codepostal" type="text" size="4" minlength= "4" maxlength="4" value="<?php echo (isset($_SESSION['post_form']['codepostal'])) ? $_SESSION['post_form']['codepostal'] : '' ?>" />
			</p>       
 
			<p>
				<label for="ville"> Ville :</label>
				<input type="text" id="ville" name="ville" value="<?php echo (isset($_SESSION['post_form']['ville'])) ? $_SESSION['post_form']['ville'] : '' ?>" />
			</p>
 
			<p style="margin-top:1.5em">
			<input name = "envoyer" value = "Envoyer" type = "submit"/>
			</p>
 
		</div>
	</form>
 
	<div style="font-size:0.8em; font-weight:bold">
	<?php
	if(isset($_SESSION['post_form']['message']) && count($_SESSION['post_form']['message']) > 0)
	{
		foreach($_SESSION['post_form']['message'] as $value) echo '<p>- '.$value.'</p>';
	}
	?>
	</div>
</div>
 
</body>
</html>

j'ai du un peu modifier le css pour aligner les deux listes mais c'est tout.

Evidemment normalement en production on choisi l'une ou l'autre façon de faire et l'on efface le code inutile plutôt que de le mettre en commentaire.

**ABCIWEB** · 27/05/2011, 19h52

Dernière mouture avec un code javascript optimisé :

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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
<?php
if (!session_id()) session_start();//déclare l'ouverture d'une session si aucune n'a été déclarée auparavant.
 
 
if (isset($_POST['envoyer'])) 
{
 
    function Verif_magicquotes ($chaine)// fonctin qui applique stripslashes si get_magic_quotes_gpc() est activé
    {
		if (get_magic_quotes_gpc()) $chaine = stripslashes($chaine);
 
		return $chaine;
    } 
 
 
    $message = array();// Pour enregistrer les messages d'information
    $_SESSION['post_form']['message'] =& $message;// avec & on assigne $message à $_SESSION['post_form']['message'] c.a.d. tout changement dans $message sera répercuté dans $_SESSION['post_form']['message']
 
 
 	$_SESSION['post_form']['cat'] = $cat = isset($_POST['cat']) && trim($_POST['cat']) != '' ? Verif_magicquotes(trim($_POST['cat'])) : null;  
 
 	$_SESSION['post_form']['selection'] = $selection = isset($_POST['selection']) && trim($_POST['selection']) != '' ? Verif_magicquotes(trim($_POST['selection'])) : null;   
 
    $_SESSION['post_form']['nom'] = $nom = isset($_POST['nom']) && trim($_POST['nom']) != '' ? Verif_magicquotes(ucfirst(trim($_POST['nom']))) : null;//ucfirst pour convertir le première lettre en majuscule
 
    $_SESSION['post_form']['prenom'] = $prenom = isset($_POST['prenom']) && trim($_POST['prenom']) != '' ? Verif_magicquotes(ucfirst(trim($_POST['prenom']))) : null;//ucfirst pour convertir le première lettre en majuscule
 
    $_SESSION['post_form']['numtel'] = $numtel = isset($_POST['numtel']) && trim($_POST['numtel']) != '' ? Verif_magicquotes(trim($_POST['numtel'])) : null;
 
    $_SESSION['post_form']['codepostal'] = $codepostal = isset($_POST['codepostal']) && trim($_POST['codepostal']) != '' ? Verif_magicquotes(trim($_POST['codepostal'])) : null;
 
	$_SESSION['post_form']['ville'] = $ville = isset($_POST['ville']) && trim($_POST['ville']) != '' ? Verif_magicquotes(trim($_POST['ville'])) : null; 
 
 
 
	if (!isset($cat))
	    {
		     $message[] = 'Veuillez choisir une catégorie';
		}  
 
 
 
	if (!isset($selection))
	    {
		     $message[] = 'Veuillez choisir une option dans la seconde liste déroulante';
		}  
 
 
 
    if (isset($nom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$nom))     
                {
                    $message[] = 'Le nom "'.$nom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }
        }
    else    
        {
             $message[] = 'Veuillez indiquer votre nom'; 
        }
 
 
 
    if (isset($prenom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$prenom)) 
                {
                    $message[] = 'Le prénom "'.$prenom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }  
        }
    else    
        { 
            $message[] = 'Veuillez indiquer votre prénom';
        }
 
 
 
    if (isset($numtel))     
        {
            if (!(preg_match("#^0[1-8]([-. ]?[0-9]{2}){4}$#", $numtel) || preg_match("#^0[1-8]([-. ]?[0-9]{1}){7}$#", $numtel)))
                {
                    $message[] = 'Le numéro de télélphone "'.$numtel.'" n\'est pas valide. Recommencez !';   
                }
        }
    else
        {
            $message[] = 'Veuillez indiquer un numéro de téléphone';        
        }
 
 
 
	if (isset($codepostal))
	    {
			if (! preg_match('#^[0-9]{4}$#',$codepostal)) 
                {		     
					$message[] = 'Le code postal doit être un nombre de 4 chiffres';
				}
		}
	else
		{
			$message[] = 'Veuillez indiquer le code postal';
		}  
 
 
 
	if (!isset($ville))
	    {
		     $message[] = 'Veuillez indiquer la ville';
		}  
 
 
 
    if (isset($message) && count($message) == 0)
        {
            //Effacement éventuel des variables de session (ou ne pas effacer si l'on veut garder les champs de formulaires remplis suite à une redirection sur cette même page)
            //unset($_SESSION['post_form']);
 
 
            // Connexion à la base de données
            try
                 {
					$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
					$bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options);
 
					// Insertion du message à l'aide d'une requête préparée
					$req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');                  
					$req->execute(array($cat, $selection, $nom, $prenom, $numtel, $codepostal, $ville));
 
					//redirection vers la page d'index
					header('Location: index.html');
					exit;
                 }
            catch(Exception $e)
                 {
                    die('Erreur : '.$e->getMessage());
                 }
        }
        else
        {
            header('Location: '.$_SERVER['PHP_SELF']);// redirige vers la page en cours en cas d'erreur (count($message) > 0)
            exit;
        }
}   
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<title>Listes li&eacute;es HTML JAVASCRIPT</title>
 
<script type="text/javascript">
<!--
function Affiche_liste(id_ensemble_select,id_select)
{
        // Sélection du bloc contenant les sélections liées (id = "categorie" dans notre exemple)
        var id_ensemble_select = document.getElementById(id_ensemble_select);
 
        // Sélection de la sélection liée
        var id_select = document.getElementById(id_select);
 
        if(id_ensemble_select)
			{
				//Initialisation d'une variable pour contenir un tableau.
				var tab = new Array();
 
				// Cherche les balises select inlues dans le bloc (id = "categorie" dans notre exemple) contenant les sélections liées  et les retourne dans un tableau
				tab = id_ensemble_select.getElementsByTagName('select');
 
				var tablength = tab.length;
 
				// Liste les éléments du tableau
				for (i=0; i < tablength; i++)        
					{
						// Met les selects en disable = true et les cache avec style.display = 'none'
						tab[i].disabled = true;
						if(id_select) tab[i].style.display = 'none';// si select est vide on ne fait rien
					}
 
				// Met la sélection liée sélectionné en disable = false et l'affiche avec style.display = 'inline'
				if(id_select)
					{
						id_select.disabled = false;
						id_select.style.display = 'inline'; 
					}     
			}
}
 
 
 
// Affiche la liste sélectionnée et l'élément sélectionné au rechargement de la page
function Affiche_liste_selected(id_ensemble_select, value_select_1, value_select_2)
{
	//sélection de l'élément, avec getElementById, de la catégorie sélectionnée
	var id_selection = document.getElementById(value_select_1);
 
	if(id_selection)
		{ 
			// Appel à la fonction Affiche_liste pour afficher la sous catégorie correspondante et mettre les autres en disabled = true; 
			Affiche_liste(id_ensemble_select,value_select_1);
 
			var id_selectionlength = id_selection.length;
 
			//liste les éléments du tableau
			for (i=0; i < id_selectionlength; i++)        
				{
					// on regarde si l'option du select est égal à la valeur de l'option 2 sélectionnée
					if (id_selection.options[i].value == value_select_2)
						{	
							// Si oui on le sélectionne
							id_selection.options[i].selected = true;		
						}
				}	
		}
}
 
 
// fonction générique permettant un appel aux fonctions javascript dès le chargement de la page.
function AddLoad_AFS(func) {
 
		if (window.addEventListener)
			{
				window.addEventListener("load", func, false);
			}
		else if (document.addEventListener)
			{
				document.addEventListener("load", func, false);
			}
		else if (window.attachEvent)
			{
				window.attachEvent("onload", func);
			}
}
 
 
<?php  if (isset($_SESSION['post_form']['cat']))
{
$value_select_1 = $_SESSION['post_form']['cat'];
$value_select_2 = isset($_SESSION['post_form']['selection'])? $_SESSION['post_form']['selection'] : null;
 ?>
// Appel à la fonction générique de cbargement onload qui appelle la fonction Affiche_liste_selected avec comme arguments l'id du bloc contenant les sélections liées, la valeur de la catégorie sélectionnée (= à l'id du bloc du select lié) et la valeur de l'option sélectionnée dans la deuxième liste.
AddLoad_AFS(function(){Affiche_liste_selected('categorie','<?php echo $value_select_1?>','<?php echo $value_select_2?>')});
 
<?php } ?>
-->
</script>
<style type="text/css">
body
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
}
 
p, input, select, form, option 
{
	padding:0;
	margin:0;
}
 
#form_identification p
{
	padding:0.5em;
}
 
/*.categorie {
	width:1.2em;
	padding:0;
	margin-right: 1em;
}
*/
#categorie, #liste1
{
    height:1.5em;
	display:inline;
}
 
#categorie select
{
    display:none;
}
 
</style>
 
</head>
 
<body>
 
<div style="width:48em;margin:auto; border:1px solid black;padding:1em">
	<form action="#" method="post" id = "form_identification">
 
		<p style="font-size:0.9em; font-style:italic;margin-bottom:1em">Cochez une des cat&eacute;gories ci-dessous, puis une option dans la liste qui s'affichera en fonction de votre choix : </p>
 
		<div>
			<p id="liste1"><!--
				<label for="metier">Metiers</label>
				<input type="radio" id = "metier" name = "cat" value = "Metiers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'checked = "checked"'; ?> />
 
				<label for="particulier">Particuliers</label>
				<input type="radio" id = "particulier" name = "cat" value = "Particuliers" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'checked = "checked"'; ?> />
 
				<label for="jardin">Jardins</label>
				<input type="radio" id = "jardin" name = "cat" value = "Jardins" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'checked = "checked"'; ?> />
 
				<label for="commerce">Commerces</label>
				<input type="radio" id = "commerce" name = "cat" value = "Commerces" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'checked = "checked"'; ?> /> 
 
				<label for="maison">Maisons</label>
				<input type="radio" id = "maison" name = "cat" value = "Maisons" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'checked = "checked"'; ?> />
 
               -->                                                    
 
				<select name = "cat" class = "categorie" onchange = "Affiche_liste(this.className,this.value)" />
 
				<option value = "" >«Choisissez»</option>
				<option value = "Metiers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Metiers") echo 'selected = "selected"'; ?> >Metiers</option>
				<option value = "Particuliers" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Particuliers") echo 'selected = "selected"'; ?> >Particuliers</option>
				<option value = "Jardins" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Jardins") echo 'selected = "selected"'; ?> >Jardins</option>
				<option value = "Commerces" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Commerces") echo 'selected = "selected"'; ?> >Commerces</option>  
				<option value = "Maisons" <?php if (isset($_SESSION['post_form']['cat']) && $_SESSION['post_form']['cat'] == "Maisons") echo 'selected = "selected"'; ?> >Maisons</option>
 
				</select>
 
			</p>
 
 
 
			<p id = "categorie">     
				<select name = "selection" id = "Metiers" style= "display:inline" disabled="disabled"> 
 
					<option value = "">«Choisissez»</option>
					<option value = "Horticulteur">Horticulteur</option>
					<option value = "Plombier">Plombier</option>
					<option value = "Electricien">Electricien</option>
					<option value = "Boulanger">Boulanger</option>        
 
				</select>
 
 
				<select name = "selection" id = "Particuliers">
 
					<option value = "">«Choisissez»</option>
					<option value = "Vente maison">Vente maison</option>
					<option value = "Location maison">Location maison</option>
					<option value = "Vente objet divers">Vente objet divers</option>
					<option value = "Proposition de services">Proposition de services</option>
 
				</select>
 
 
				<select name = "selection" id = "Jardins">
 
					<option value = "">«Choisissez»</option>
					<option value = "EntrepriseJardin">EntrepriseJardin</option>
					<option value = "Taille des haies">Tailles des haies</option>
					<option value = "Pavage carrelage terrasse">Pavage carrelage terrasse</option>
 
				</select>
 
 
				<select name = "selection" id = "Commerces">
 
					<option value = "">«Choisissez»</option>
					<option value = "Vente cadeaux">Vente cadeaux</option>
					<option value = "Fleurs artificielles">Fleurs artificielles</option>
					<option value = "Plantes vivaces">Plantes vivaces</option>
					<option value = "Couronnes mortuaires">Couronnes mortuaires</option>
 
				</select>
 
 
				<select name = "selection" id = "Maisons">
 
					<option value = "">«Choisissez»</option>
					<option value = "Décoration">D&eacute;coration</option>
					<option value = "Peintre">Peintre</option>
					<option value = "Tapissier">Tapissier</option>
					<option value = "Renovation">Renovation</option>
 
				</select>	
 
			</p>   
		</div> 
 
 
 
		<div  style="margin-top:2em">  
			<p>
				<label for="nom"> Nom :</label>
				<input type="text" id="nom" name="nom" value="<?php echo (isset($_SESSION['post_form']['nom'])) ? $_SESSION['post_form']['nom'] : '' ?>" />
			</p>
 
			<p>
				<label for="prenom"> Pr&eacute;nom :</label>
				<input type="text" id="prenom" name="prenom" value="<?php echo (isset($_SESSION['post_form']['prenom'])) ? $_SESSION['post_form']['prenom'] : '' ?>" />
			</p>
 
			<p>
				<label for="numtel"> N&deg;de t&eacute;l&eacute;phone :</label>
				<input type="text" id="numtel" name="numtel" value="<?php echo (isset($_SESSION['post_form']['numtel'])) ? $_SESSION['post_form']['numtel'] : '' ?>" />
			</p>
 
			<p>
				<label for="codepostal"> Votre code postal :</label>
				<input name="codepostal" id="codepostal" type="text" size="4" minlength= "4" maxlength="4" value="<?php echo (isset($_SESSION['post_form']['codepostal'])) ? $_SESSION['post_form']['codepostal'] : '' ?>" />
			</p>       
 
			<p>
				<label for="ville"> Ville :</label>
				<input type="text" id="ville" name="ville" value="<?php echo (isset($_SESSION['post_form']['ville'])) ? $_SESSION['post_form']['ville'] : '' ?>" />
			</p>
 
			<p style="margin-top:1.5em">
			<input name = "envoyer" value = "Envoyer" type = "submit"/>
			</p>
 
		</div>
	</form>
 
	<div style="font-size:0.8em; font-weight:bold">
	<?php
	if(isset($_SESSION['post_form']['message']) && count($_SESSION['post_form']['message']) > 0)
	{
		foreach($_SESSION['post_form']['message'] as $value) echo '<p>- '.$value.'</p>';
	}
	?>
	</div>
</div>
 
</body>
</html>

Par rapport à la précédente version, le code javascript qui affiche au rechargement de la page les éléments précédemment sélectionnés a été modifié pour pouvoir être utilisé par plusieurs couples de listes déroulantes liées.
Une petite modification du code de la fonction initiale a également été faite pour ne pas envoyer de valeur pour la deuxième liste déroulante au cas où le visiteur serait revenu sur la valeur "choisissez" dans la première liste.

**Claudine** · 29/05/2011, 11h09

Bonjour ABCIWEB,
Tout simplement fabuleux et irréprochable!
Je mesure l'abîme qu'il me reste à combler dans ce travail difficile mais au combien intéressant. Je suis obstiné et je veux surtout comprendre le fonctionnement de ce travail remarquable. Aussi, je me permet de laisser cette discussion ouverte pour d'éventuelles questions de compréhension.
Parlant de compréhension, suite à l'affichage des messages d'erreur avec les boutons radio et liste déroulante lors des précédentes discussions: j'ai trouvé la solution: il faut modifier le bloc:

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
if (!(isset($_POST['cat']) && trim($_POST['cat']) != ''))
	    {
		     $message[] = 'Veuillez cocher un des boutons pour choisir une catégorie';
		}  
 
 
 
		 if (!(isset($_POST['selection']) && trim($_POST['selection']) != ''))
	    {
		     $message[] = 'Veuillez cliquer une sélection dans la liste déroulante';
	    }  
 
 
 
 
 
 
 
    if (isset($nom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$nom))     
                {
                    $message[] = 'Le nom "'.$nom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }
        }
    else    
        {
             $message[] = 'Veuillez indiquer votre nom'; 
        }
 
 
 
    if (isset($prenom))
        {
            if (! preg_match('#^[a-zéèàçïêë ]{3,12}$#i',$prenom)) 
                {
                    $message[] = 'Le prénom "'.$prenom.'" n\'est pas valide. Minimum 3 lettres, maximum 12. Chiffres non autorisés. Recommencez !';   
                }  
        }
    else    
        { 
            $message[] = 'Veuillez indiquer votre prénom';
        }
 
 
 
    if (isset($numtel))     
        {
            if (!(preg_match("#^0[1-8]([-. ]?[0-9]{2}){4}$#", $numtel) || preg_match("#^0[1-8]([-. ]?[0-9]{1}){7}$#", $numtel)))
                {
                    $message[] = 'Le numéro de télélphone "'.$numtel.'" n\'est pas valide. Recommencez !';   
                }
        }
    else
        {
            $message[] = 'Veuillez indiquer un numéro de téléphone';        
        }
 
 
 
	if (isset($codepostal))
	    {
			if (! preg_match('#^[0-9]{4}$#',$codepostal)) 
                {		     
					$message[] = 'Le code postal doit être un nombre de 4 chiffres';
				}
		}
	else
		{
			$message[] = 'Veuillez indiquer le code postal';
		}  
 
 if (!(isset($_POST['ville']) && trim($_POST['ville']) != ''))
	    {
		     $message[] = 'Veuillez indiquer la ville';
		}	 
 
	//if (!isset($ville))
	 //   {
	//	     $message[] = 'Veuillez indiquer la ville';
	//	}  
 
 
    if (isset($message) && count($message) == 0)

Bien évidemment, le système à deux listes déroulantes est beaucoup plus pratique car il ne nécessite pas de recocher à chaque fois qu'il y a une erreur.

Parlant d'erreur, je me suis rendu compte qu'une erreur de chiffres ou de lettres malgré les codes de validité est malheureusement enregistrée dans la base de données.
Pouvez-vous me décrire la marche à suivre pour que le clients qui voit des erreurs d'orthographe dans l'enregistrement de ses données puisse se corriger? Dois-je prévoir un autre formulaire pour la correction et comment autoriser ce client à modifier ses données?
Sincères remerciements pour ce professeur particulier génial !
Claudine

**ABCIWEB** · 30/05/2011, 18h14

Je vois pas de problème dans le code de mon dernier message. On rentre dans la condition qui enregistre les données en bdd uniquement lorsqu'il n'y a pas d'erreur. As-tu essayé de copier-coller mon code dans une page vierge et de tester ? parce que chez moi cela fonctionne correctement.
D'ailleurs je vois dans l'extrait de code que tu donne que tu n'utilises pas ce même code...

**Claudine** · 02/06/2011, 08h09

Bonjour ABCIWEB,
Il n'y a en effet aucun problème et comme je l'ai dit :c'est tout simplement fabuleux et irréprochable!
Mais, je me rends compte que je me suis mal exprimé(veuillez m'en excuser) en effet,malgré les codes de validité ,on ne peut empêcher une erreur d'orthographe ou de chiffres lors de la saisie des coordonnées par le client et si celui-ci à envoyer les données, elles sont malheureusement enregistrées dans la base de données.
Comment procéder pour que le client puisse se corriger puisque ce dernier s'aperçoit que les données enregistrées dans la table correspondante sont partiellement fausses.
Partant du travail réalisé jusqu'à présent, comment dois-je procéder? Dois-je prévoir un autre formulaire pour la correction et comment autoriser ce client à modifier ses données?
Salutations et remerciements pour vos conseils
Claudine

**ABCIWEB** · 02/06/2011, 19h33

Merci pour les compliments, à vrai dire je ne fais pas ça pour tous les topic, mais tu as un peu de chance car celui-ci sera destiné à être la base d'un tuto pour débutants, c'est pour cette raison que j'essaie de faire un code à la fois complet tout en restant accessible

Ce que tu demande semble être une page de confirmation. Donc rien de plus simple puisque le code enregistre les données en session.

Quand les données passent les validations, actuellement on enregistre les données en bdd puis on redirige par exemple vers "index.html" avec la ligne "header('Location: index.html');".
Il suffit de ne pas enregistrer les données mais de rediriger le visiteur vers un autre fichier que tu appelle par exemple "confirmation.php" et dans ce nouveau ficher tu fais afficher les variables de sessions.
En dessous tu mets deux boutons, "confirmer" et "modifier".
Si le visiteur appuies sur le bouton "confirmer", tu enregistre les données en bdd et tu le redirige vers une page de ton choix.

S'il appuie sur "modifier" tu redirige vers la page du formulaire qui aura automatiquement toutes les informations pré remplies dans les champs grâce aux variables de sessions déjà en place.

PS : Dans le code précédent il manque une vérification sur ton champ unique qui identifie la ligne dans ta table. Normalement il s'agit du numéro de téléphone puisque les autres champs peuvent être identiques pour deux visiteurs différents. Actuellement si ta table est bien conçue, l'insertion ne pourra pas se faire et l'exception sera levée, mais bon on arrivera à la ligne die('Erreur : '.$e->getMessage()); qui n'est pas vraiment un message d'erreur destiné aux visiteurs

**Claudine** · 03/06/2011, 10h08

Bonjour ABCIWEB,
Comme vous le dites rien de plus simple, il suffit de....
Malheureusement pour un débutant tout est problème!
J'ai réalisé une page "confirmation.php" avec la ligne de code que vous m'avez indiqué ainsi que les boutons "confirmé" et "modifier" mais il y a une erreur dans la syntaxe puisqu'il m'affiche le code d'erreur ci-dessous :

//"Parse error: syntax error, unexpected T_ENCAPSED_AND_WHITESPACE, expecting T_STRING or T_VARIABLE or T_NUM_STRING in C:\Program Files\EasyPHP-5.3.3.1\www\etre\confirmation.php on line 3"//

A toutes fins utiles voici la page"confirmation.php

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
 
<?php
 $query="SELECT * FROM coordonnees WHERE numtel=  $_SESSION['post_form']['numtel']"
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<title>confirmation.php</title>
<head>
<body>
<FORM METHOD=POST ACTION="DFormCompl.php"
<p style="margin-top:1.5em">
			<input name = "modifier" value = "modifier" type = "submit"/>
 
			</p>
 
</FORM>	
<FORM METHOD=POST ACTION="Index.html"
<p style="margin-top:1.5em">
			<input name = "confirmer" value = "confirmer" type = "submit"/>
 
			</p>
 
</FORM>			
</body>
</html>

Voulez-vous me dépanner car je ne suis pas certain de très bien comprendre le $query (je suppose que je devrais taper le numtel de la ligne que je vais éventuellement modifier) et que la ligne correspondante va s'afficher dans le formulaire de base et puis confirmer l'envoi.Mais dans ce cas, n'y aura-t-il pas deux lignes enregistrées dans la base de données(l'ancienne et la nouivelle ligne)?
Mes plus vifs remerciements
Claudine

**ABCIWEB** · 03/06/2011, 20h40

En fait j'ai changé de stratégie en corrigeant mon dernier message hier. Relis le, c'est plus simple car finalement pas besoin de requête pour afficher la page de confirmation il te suffit de lister les variables de session.
Et tu enregistre les variables de session en bdd uniquement si le visiteur appuie sur "confirmer"

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
<?php
session_start();
 
if (isset($_POST["modif"]))
{
	header('Location: formulaire.php');// mettre le nom du fichier de ton formulaire à la place de "formulaire.php"
	exit;
}
 
if (isset($_POST["conf"]))
{
	// enregistrement des données de session en bdd
} 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
</head>
 
<body>
<p>Votre nom : <?php echo isset($_SESSION['post_form']['nom'])? $_SESSION['post_form']['nom'] : '' ?></p>
<p>Votre prenom : <?php echo isset($_SESSION['post_form']['prenom'])? $_SESSION['post_form']['prenom'] : '' ?></p>
<p>Votre téléphone : <?php echo isset($_SESSION['post_form']['numtel'])? $_SESSION['post_form']['numtel'] : '' ?></p>
etc.
 
<form action = '#' method = "post" >
<p>
<input type = "submit" value = "modifier" name= "modif" />
<input type = "submit" value = "confirmer" name= "conf" />
</p>
</form>
</body>
</html>

**Claudine** · 04/06/2011, 12h17

Bonjour ABCIWEB,
Merci pour cette aide , mais dès que je clic sur confirmer je n'arrive pas à enregistrer dans la bdd.(j'ai enlevé le code d'enregistrement dans la bdd du formulaire de base pour le mettre dans "confirmation" mais, j'ai toujours le message d'erreur.

Parse error: syntax error, unexpected ';', expecting T_CATCH in C:\Program Files\EasyPHP-5.3.3.1\www\etre\confirmation.php on line 26
Je me permets de joindre le fichier en question:

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
 
<?php
session_start();
 
if (isset($_POST["modif"]))
{
	header('Location: FormComplplusComfirm.php');// mettre le nom du fichier de ton formulaire à la place de "formulaire.php"
	exit;
}
 
if (isset($_POST["conf"]))
{
 
	// enregistrement des données de session en bdd
 
 try
                 {
					$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
					$bdd = new PDO('mysql:host=localhost;dbname=clients', 'root', '', $pdo_options);
 
					// Insertion du message à l'aide d'une requête préparée
					$req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');                  
				//Ligne22 	$req->execute(array($cat, $selection, $nom, $prenom, $numtel, $codepostal, $ville));
 header('Location: Index.html');       
}      
 
 ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
</head>
 
<body>
<p>Votre catégorie : <?php echo isset($_SESSION['post_form']['cat'])? $_SESSION['post_form']['cat'] : '' ?></p>
<p>Votre sélection: <?php echo isset($_SESSION['post_form']['selection'])? $_SESSION['post_form']['selection'] : '' ?></p>
<p>Votre nom : <?php echo isset($_SESSION['post_form']['nom'])? $_SESSION['post_form']['nom'] : '' ?></p>
<p>Votre prenom : <?php echo isset($_SESSION['post_form']['prenom'])? $_SESSION['post_form']['prenom'] : '' ?></p>
<p>Votre téléphone : <?php echo isset($_SESSION['post_form']['numtel'])? $_SESSION['post_form']['numtel'] : '' ?></p>
<p>Votre code postal : <?php echo isset($_SESSION['post_form']['codepostal'])? $_SESSION['post_form']['codepostal'] : '' ?></p>
 
<p>Ville : <?php echo isset($_SESSION['post_form']['ville'])? $_SESSION['post_form']['ville'] : '' ?></p>
 
<form action = '#' method = "post" >
<p>
<input type = "submit" value = "modifier" name= "modif" />
<input type = "submit" value = "confirmer" name= "conf" />
</p>
</form>
</body>
</html>

Une fois de plus voulez-vous m'aider car je n'arrive pas à modifier correctement pour enfin terminer cette confirmation?
Sincères remerciements pour votre patience
Claudine

**ABCIWEB** · 04/06/2011, 21h08

Bonjour,

Apparemment la requête fonctionnait dans ton formulaire, et c'était

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
// Connexion à la base de données
try
       {
		$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
		$bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options);
 
		// Insertion du message à l'aide d'une requête préparée
		$req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');                  
		$req->execute(array($cat, $selection, $nom, $prenom, $numtel, $codepostal, $ville));
 
		//redirection vers la page d'index
		header('Location: index.html');
		exit;
       }
  catch(Exception $e)
       {
               die('Erreur : '.$e->getMessage());
       }

Bon c'est donc la même mais il faut utiliser les variables de session pour renseigner tes champs (les autres variables $cat, $selection, $nom etc. sont indéfinies dans cette page).

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
//...
if (isset($_POST["conf"],$_SESSION['post_form']))
{
try
       {
		$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
		$bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options);
 
		// Insertion du message à l'aide d'une requête préparée
		$req = $bdd->prepare('INSERT INTO coordonnees (cat, selection, nom, prenom, numtel, codepostal, ville) VALUES(?, ?, ?, ?, ?, ?, ?)');                  
                $req->execute(array($_SESSION['post_form']['cat'], $_SESSION['post_form']['selection'], $_SESSION['post_form']['nom'], $_SESSION['post_form']['prenom'], $_SESSION['post_form']['numtel'], $_SESSION['post_form']['codepostal'], $_SESSION['post_form']['ville']));
 
		//redirection vers la page d'index
		header('Location: index.html');
		exit;
       }
 catch(Exception $e)
       {
                die('Erreur : '.$e->getMessage());
       }
}
//...

(Ne pas oublier le "exit;" après un header Location)

empêcher l'enregistrement dans ma bdd de données non valides

Langage PHP

Discussions similaires

Partager

Partager