Afficher valeur d'un select au chargement page

**michgoarin** · 03/03/2016, 21h41

Bonjour,

J'ai un formulaire de saisi (exemple transmis) avec un formulaire optionnel. Le traitement se fait par l'intermédiaire de la page de traitement_formulaire.php. En cas de mauvaise saisie, la page formulaire.php se charge via un include.

Le problème : au rechargement de la page, je souhaiterai que si l'utilisateur à saisi "Projet", le formulaire optionnel s'affiche automatiquement.

J'ai à peu près tout essayé mais mes connaissances en javascript sont assez limitées.

La page onChange.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
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
 
<!doctype html>
<html>
<head>
	<meta charset='utf-8'>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="styles.css">
	<link rel="icon" type="image/png" href="images/design/ico.png" /> 
	<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
	<script src="script.js"></script>
	<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
	<title>Administrer le Site</title>
</head>
<script type="text/javascript">
	// Fonction permettant l'affichage du formulaire si l'utilisateur sélectionne "Projet"
	function  changementType()  {
		// On définit la variable sélectionnée
		var type = document.getElementById("type").value;
		if (type == "Projet") 
		{
			// Affichage du formulaire
			document.getElementById("fournisseur").style="display:block";
		} 
		else
		{
			// Le formulaire est masqué
		document.getElementById("fournisseur").style="display:none";
		}
	}
</script>
<body>
<div id="formulaire">
	<!--Le traitement des informations : traitement_formulaire.php -->
	<form method="post" action="traitement_formulaire.php">
		<div>
			<label for="fonction">Fonction : </label><br/>
			<input type="text" name="fonction" id="fonction" value=""/><br/>
			<label for="type">Type : </label><br/>
			<select id="type" name="type" size="1" onchange="changementType();">
					<option value="Emploi">Emploi
					<option value="Stage" >Stage
					<option value="Projet">Projet
			</select>
		</div>
 
 
		<!--Formulaire en option -->
		<div style="display:none;" id="fournisseur">
				<div class="name">
				  <label for="name">Your Name:</label>
				  <p> Please enter your full name</p>
				  <input type="text" name="name" id="name" value=""/>
				</div>
		</div>
 
 
		<!-- Bouton de validation -->
		<input type="submit" name="submit" value="Submit" />
	</form>
</div>
</body>
</html>

La page de traitement : traitement_formulaire.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
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
 
<!doctype html>
<html>
<head>
	<meta charset='utf-8'>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="styles.css">
	<link rel="icon" type="image/png" href="images/design/ico.png" /> 
	<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
	<script src="script.js"></script>
	<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
	<title>Administrer le Site</title>
</head>
 
<body>
<?php
if (!empty($_POST['submit'])){
        
        
        //===============================================
        //              Définition des Regex
        //===============================================
        $form_nom= "/^([a-zA-Z'àâéèêôùûïçÀÂÉÈÔÙÛÏÇ[:blank:]-]{1,30})$/";
        
        
        
        
        
        //===============================================
        //              Traitement de la fonction postée
        //===============================================
        
        if(!empty($_POST['fonction']))
        /* Si le champ est bien rempli*/
        {
                /*Test du format du code postal*/
                if(!preg_match($form_nom, $_POST['fonction']))
                {
                $mauvaisFormat[] ="La fonction ne respecte pas le bon format !!!";// Mauvais format
                }
                else
                {
                $fonction=$_POST['fonction'];// Définition de la variable
                }
        }
        else 
        {
        $tabloVide[] ="Veuillez renseigner la fonction dans l'entreprise !!!";// Si champ vide
        }
        
        //===============================================
        //              Traitement du type posté
        //===============================================
        
        if(!empty($_POST['type']))
        /* Si le champ est bien rempli*/
        {
                /*Test du format du code postal*/
                if(!preg_match($form_nom, $_POST['type']))
                {
                $mauvaisFormat[] ="Le type ne respecte pas le bon format !!!";// Mauvais format
                }
                else
                {
                $type=$_POST['type'];// Définition de la variable
                }
        }
        else 
        {
        $tabloVide[] ="Veuillez renseigner le type dans l'entreprise !!!";// Si champ vide
        }
        
        
        // Si le type posté est "Projet", l'utilisateur doit saisir son nom
        if ($type=="Projet"){
                //===============================================
                //              Traitement du nom posté
                //===============================================
                
                if(!empty($_POST['name']))
                /* Si le champ est bien rempli*/
                {
                        /*Test du format du code postal*/
                        if(!preg_match($form_nom, $_POST['name']))
                        {
                        $mauvaisFormat[] ="Votre nom ne respecte pas le bon format !!!";// Mauvais format
                        }
                        else
                        {
                        $name=$_POST['$form_nom'];// Définition de la variable
                        }
                }
                else 
                {
                $tabloVide[] ="Veuillez renseigner votre nom !!!";// Si champ vide
                }
        }
        
                // Par la fonction @sizeof on calcul, le nombre d'occurence dans $mauvaisFormat[] et $tabloVide[]       
                if (@sizeof($tabloVide) > 0 or @sizeof($mauvaisFormat) > 0)
                {
                        //===================================================
                        //              Traitement des champs vides
                        //===================================================
                        
                        if(@sizeof($tabloVide) > 0)
                        {
                                echo ("
                                        <h1>Traitement champs de saisie vide...</h1>
                                        <b>Un champ au moins est vide. Vous devez remplir :</b><br>
                                        ");
                                        
                                        
                                        //Liste des champs vides
                                        foreach($tabloVide as $champsvides)
                                        {
                                        echo "$champsvides<br/>";
                                        }       
                                
                                
                                
                                // Mon problème vient au rechargement du formulaire
                                include("formulaire.php");
                                
                                exit();
                        }
                        //===================================================
                        //              Traitement des mauvais formats
                        //===================================================                   
                        if(@sizeof($mauvaisFormat) > 0)
                        {
                        echo ("
                                <h1>Traitement champs de saisie incorrect...</h3>
                                <b>Un champ au moins contient une donnée incorrecte. Corrigez :</b><br>
                                ");                     
                                //Liste des champs incorrects
                                foreach($mauvaisFormat as $champsMauvais)
                                {
                                echo "$champsMauvais<br/>";
                                }
                                
                                
                                
                                // Mon problème vient au rechargement du formulaire
                                include("formulaire.php");
                                
                                
                                
                                exit();
                        }
                }
                else{
                        //===================================================
                        //              Les données postées peuvent être traitées
                        //===================================================
                        
                        echo ("
                                Votre Nom : <em>".$fonction."</em><br/>
                                Votre Statut : <em>".$type."</em>
                                ");
                        // Toutes des données peuvent être envoyées dans une BDD
                        
                }
}
else{echo "<h1>Veuillez Revenir sur le formulaire !!!</h1>";}
?>
</body>
</html>

Le formulaire : formulaire.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
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
 
<!--
Je souhaiterai qu'au rechargement de cette page, si l'utilisateur a sélectionné
"Projet", le formulaire réaffiche le formulaire optionnel
-->
 
<?php
// On configure le select afin de réaffiché la valeur sélectionnée
if ($_POST['type']==""){$selEmploi="SELECTED";} else{$selEmploi="";}
if ($_POST['type']==""){$selStage="SELECTED";} else{$selStage="";}
if ($_POST['type']==""){$selProjet="SELECTED";} else{$selProjet="";}
?>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
	// Fonction permettant l'affichage du formulaire si l'utilisateur sélectionne "Projet"
	function  changementType()  {
		// On définit la variable sélectionnée
		var type = document.getElementById("type").value;
		if (type == "Projet") 
		{
			// Affichage du formulaire
			document.getElementById("fournisseur").style="display:block";
		} 
		else
		{
			// Le formulaire est masqué
		document.getElementById("fournisseur").style="display:none";
		}
	}
</script>
<div id="formulaire">
	<form method="post" action="traitement_formulaire.php">
		<div>
			<label for="fonction">Fonction : </label><br/>
			<input type="text" name="fonction" id="fonction" value="<?php echo $_POST['fonction'];?>"/><br/>
			<label for="type">Type : </label><br/>
			<select id="type" name="type" size="1" onchange="changementType();">
					<option value="Emploi" <?php echo $selEmploi;?> >Emploi
					<option value="Stage" <?php echo $selStage;?> >Stage
					<option value="Projet" <?php echo $selProjet;?> >Projet
			</select>
		</div>
 
 
		<!--Formulaire en option -->
		<div style="display:none;" id="fournisseur">
			<div class="name">
			  <label for="name">Your Name:</label>
			  <p> Please enter your full name</p>
			  <input type="text" name="name" id="name" value="<?php echo $_POST['name'];?>"/>
			</div>
		</div>
 
 
		<!-- Bouton de validation -->
		<input type="submit" name="submit" value="Submit" />
	</form>
</div>

Merci pour votre aide.

**michgoarin** · 03/03/2016, 22h29

Bonjour,

Tout d'abord, il y avait quelques erreurs que j'ai corrigé dans le formulaire (j'ai codé cet exemple en très peu de temps afin de trouver la solution à mon problème).

J'ai trouvé une solution qui fonctionne mais je ne sais pas si c'est très catholique :

formulaire.php (corrigé et amélioré)

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
 
<!--
Je souhaiterai qu'au rechargement de cette page, si l'utilisateur a sélectionné
"Projet", le formulaire réaffiche le formulaire optionnel
-->
 
<?php
// On configure le select afin de réaffiché la valeur sélectionnée
if ($_POST['type']=="Emploi"){$selEmploi="selected";} else{$selEmploi="";}
if ($_POST['type']=="Stage"){$selStage="selected";} else{$selStage="";}
if ($_POST['type']=="Projet"){$selProjet="selected";} else{$selProjet="";}
?>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
	// C'est peut-être la solution la moins pourrie que j'ai trouvé pour recharger les éléments du select
	window.onload = function chargement() {
		var type = "<?php echo $_POST['type'];?>";
		if (type=="Projet") 
		{
			// Affichage du formulaire
			document.getElementById("fournisseur").style="display:block";
		} 
		else
		{
			// Le formulaire est masqué
		document.getElementById("fournisseur").style="display:none";
		}		
	};
	// Fonction permettant l'affichage du formulaire si l'utilisateur sélectionne "Projet"
	function  changementType()  {
		// On définit la variable sélectionnée
		var type = document.getElementById("type").value;
		if (type == "Projet") 
		{
			// Affichage du formulaire
			document.getElementById("fournisseur").style="display:block";
		} 
		else
		{
			// Le formulaire est masqué
		document.getElementById("fournisseur").style="display:none";
		}
	}
</script>
<div id="formulaire">
	<form method="post" action="traitement_formulaire.php">
		<div>
			<label for="fonction">Fonction : </label><br/>
			<input type="text" name="fonction" id="fonction" value="<?php echo $_POST['fonction'];?>"/><br/>
			<label for="type">Type : </label><br/>
			<select id="type" name="type" size="1" onchange="changementType();">
					<option value="Emploi" <?php echo $selEmploi;?> >Emploi
					<option value="Stage" <?php echo $selStage;?> >Stage
					<option value="Projet" <?php echo $selProjet;?> >Projet
			</select>
		</div>
 
 
		<!--Formulaire en option -->
		<div style="display:none;" id="fournisseur">
			<div class="name">
			  <label for="name">Your Name:</label>
			  <p> Please enter your full name</p>
			  <input type="text" name="name" id="name" value="<?php echo $_POST['name'];?>"/>
			</div>
		</div>
 
 
		<!-- Bouton de validation -->
		<input type="submit" name="submit" value="Submit" />
	</form>
</div>

J'ai créer une fonction qui utilise "window.onload = function chargement() {}". Je suis obligé de déclarer la variable avec du PHP.
Je pense qu'il y a un autre moyen.

Afficher valeur d'un select au chargement page

JavaScript

Discussions similaires

Partager

Partager