Discussion :

[dride]

salut tout le monde bah voila j'ai suivie le tuto sur les listes liées avec httprequest et j'ai essayé de le testé en l'adaptant a mes traitement sauf que j'ai pas les resutats attendus

voila ma page html :

Code html :

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
<div class="field">
  <label> Année d'exercice</label>
  <select class="ui fluid dropdown" name="annee" id="annee" onchange="requestProjet(this);">
    <option value="">Année d'exercice</option>
    <?php
      foreach($vue_exe as $looks_exe)
      {
    ?>
    <option value="<?php echo htmlspecialchars($looks_exe['EXE_CODE']); ?>" ><?php echo(htmlspecialchars($looks_exe['EXE_AN'])); ?> </option>
    <?php
      }
    ?>
    </select>
    <span id="loader">
    <img src="../images/loader.gif">
    </span>
</div>
<div class="field" >
  <label>Projet </label>
  <select class="ui fluid dropdown" name="projet" id="projet">
    </select>

ensuite ma page list_projet.js:

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
function getXhr(){
	var xhr = null ;
	if(window.XMLHttpRequest)
		xhr = new XMLHttpRequest ;
	else if(window.ActiveXObject)
		{
			try
			{
				xhr = new ActiveXObject("Msxml2.XMLHTTP");
			}
			catch(e)
			{
				xhr = new ActiveXObject('Microsoft.XMLHTTP');
			}
		}
	else
		{
			alert('merde ton navigateur il trop chelou');
			xhr = false ;
		}
	return xhr ;
function requestProjet(oSelect){
	var xhr = getXhr();
	var value = oSelect.options[oSelect.selectedIndex].value;
	xhr.onreadystatechange = function() {
		if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)){
			readData(xhr.responseXML);
			document.getElementById("loader").style.display = "none";
		}
		else if (xhr.readyState < 4){
			document.getElementById("loader").style.display =  "inline" ;
		}
		xhr.open("POST", "list_projet_by_id.php", true);
		xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		xhr.send("EXE_CODE" + value) ;
	}
}
function readData (oData){
	var nodes = oData.getElementsByTagName("item");
	var oSelect = document.getElementById("projet");
	var oOption , oInner;
	oSelect.innerHTML = "";
	for (var i=0, c=nodes.length; i<c; i++){
		oOption = document.createElement("option");
		oInner = document.createTextNode(nodes[i].getAttribute("name"));
		oOption.value = nodes[i].getAttribute("id");
		oOption.appendChild(oInner);
        oSelect.appendChild(oOption);
	}
}

et enfin ma page list_projet_by_id.php

Code php :

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
header("Content-Type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
echo "<list>";
	$exe = (isset($_POST["EXE_CODE"])) ? htmlentities($_POST["EXE_CODE"]) : NULL;
			if (isset($exe))
			{
				try
				{
					require('../../model/kernel/kernel.php');
			$projet = $base -> prepare("SELECT PRJ_CODE, PRJ_LIB FROM  projet INNER JOIN exercice 
											ON projet.EXE_CODE = exercice.EXE_CODE AND exercice.EXE_CODE = :exe ");
			$projet ->execute(array(
				'exe' => $exe
				)) or die(print_r($projet->errorInfo()));
			$vue_projet = $projet -> fetchAll();
			foreach($vue_projet as $looks_projet)
			{
				echo "<item id=\"" . $looks_projet["PRJ_CODE"] . "\" name=\"" . $looks_projet["PRJ_LIB"] . "\" />";
			}
				}
				catch(exception $error)
				{
					die('erreur'.$error->getMessage());
				}
			}
echo("</list>");
?>

quelqu'un pourrai m'aider svp je bloke

[NoSmoking]

Bonjour,

xhr.send("EXE_CODE" + value) ;

ne manquerait-il pas un signe égal ?

[dride]

oui j'ai corrigé ce probleme mais toujours rien

[NoSmoking]

... sauf que j'ai pas les resutats attendus...

Certes mais qu"attends tu comme résultat et qu'est ce qu'obtiens tu ?

Pourquoi passer par un fichier XML si c'est pour le transformer en <select> ?

[dride]

en faite j'ai 2 listes et lorsque je choisis un element dans la premiere liste il charge les element correspondant dans la deuxieme liste
sauf que dans mon cas quand je choisis un element dans la premiere liste rien dans la deuxieme
consernant le faite d'utiliser XML me plait bien comme http://www.developpez.net/forums/images/smilies/icon_razz.gif

[andry.aime]

Bonjour,

Vérifie bien tes accolades.

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
function getXhr(){
	var xhr = null ;
	if(window.XMLHttpRequest)
		xhr = new XMLHttpRequest ;
	else if(window.ActiveXObject)
		{
			try
			{
				xhr = new ActiveXObject("Msxml2.XMLHTTP");
			}
			catch(e)
			{
				xhr = new ActiveXObject('Microsoft.XMLHTTP');
			}
		}
	else
		{
			alert('merde ton navigateur il trop chelou');
			xhr = false ;
		}
	return xhr ;  // Il te manque la fermeture ici
function requestProjet(oSelect)

A+.

[dride]

j'ai tester mais rien aucun changement

[andry.aime]

Montre les modifications que t'as faites et aussi le code HTML généré de la page contenant le select mais pas son code PHP.

[dride]

donc voila ma page html

Code html :

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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1">
	<link rel="stylesheet" type="text/css" href="../semantic/dist/semantic.min.css">
	<link rel="stylesheet" type="text/css" href="../css/mission.css">
	<script type="text/javascript" src="../semantic/dist/semantic.min.js"></script>
	<script type="text/javascript" src="../js/mission/list_projet.js"></script>
 
 
    <title>test</title>
 
 
 
    <script src="app.js" defer></script>
 
  </head>
 
  <body>
 
 
 
 
 
 
		<div class="mission_insert">
 
		<form class="ui form" action="" method="post"  >
 
		<div class="ui grid">
 
		<div class="two column row">
 
			<div class="left floated three wide column" id="total">
 
			<div class="field" >
 
				<label>Total Prime Mission</label> 
				<input disabled="" name="prime_mission" placeholder="prime" type="text" value=""  />
 
			</div>
 
			<div class="field" >
 
				<label>Total prix carburant</label> 
				<input disabled="" name="total_carburant" placeholder="carburant" type="text" value=""  />
 
			</div>
 
 
			<div class="field" >
 
				<label>Total mission FCFA</label> 
				<input disabled="" name="total_mission" placeholder="total mission" type="text" value=""  />
 
			</div>
 
 
		</div>
 
		<div class="right floated eleven wide column">
 
		<fieldset>
 
			<legend>Mission</legend>
 
 
 
 
				<div class="field">
 
					<label> Année d'exercice</label>
 
					<select class="ui fluid dropdown" name="annee" id="annee" onchange="requestProjet(this);">
 
						<option value="">Année d'exercice</option>
 
						<?php
                                                        
                                                        foreach($vue_exe as $looks_exe)
                                                        {
                                                                
                                                        
 
                                                
                                                ?>
 
						<option value="<?php echo htmlspecialchars($looks_exe['EXE_CODE']); ?>" ><?php echo(htmlspecialchars($looks_exe['EXE_AN'])); ?> </option>
 
						<?php
                                                        }
                                                        
                                                
                                                ?>
						</select>
 
						<span id="loader">
 
						<img src="../images/loader.gif">
 
 						</span>
 
 
				</div>
 
				<div class="field" >
 
					<label>Projet </label>
 
					<select class="ui fluid dropdown" name="projet" id="projet">
 
 
 
						</select>
 
 
				</div>
 
 
 
				<div class="field">
 
					<label>Site</label>
 
 
					<select class="ui fluid dropdown" name="site">
 
						<option value="">site</option>
 
						<?php
                                                        
                                                        foreach($vue_site as $looks_site)
                                                        {
 
                                                
                                                ?>
 
						<option value="<?php echo (htmlspecialchars($looks_site['SITE_ID'])); ?>" ><?php echo($looks_site['SITE_NOM']); ?> </option>
 
						<?php
                                                        
                                                        
                                                        
                                                        }
                                                
                                                ?>
						</select>
 
 
				</div>
 
 
				<div class="field">
 
					<label>Vehicule</label>
 
					<select class="ui fluid dropdown" name="vehicule">
 
						<option value="">Vehicule</option>
 
						<?php
                                                        
                                                        foreach($vue_vehicule as $looks_vehicule)
                                                        {
                                                                
                                                        
 
                                                
                                                ?>
 
						<option value="<?php echo htmlspecialchars($looks_vehicule['VEH_ID']); ?>" ><?php echo(htmlspecialchars($looks_vehicule['VEH_LIB'])); ?> </option>
 
						<?php
                                                        }
                                                        
                                                
                                                ?>
						</select>
 
 
				</div>
 
 
				<div class="field">
 
					<label>Type de l'intervenant</label>
 
					<select class="ui fluid dropdown" name="intervenant">
 
						<option value="intervenant"></option>
 
						<?php
                                                        
                                                        foreach($vue_equipe as $looks_equipe)
                                                        {
                                                                
                                                        
 
                                                
                                                ?>
 
						<option value="<?php echo htmlspecialchars($looks_exe['EQU_ID']); ?>" ><?php echo(htmlspecialchars($looks_exe['EQU_TYPE'])); ?> </option>
 
						<?php
                                                        }
                                                        
                                                
                                                ?>
						</select>
 
 
				</div>
 
 
				<div class="field">
 
					<label>Distance total(KM)</label>
					<input name="distance" placeholder="KM" type="text"  />
 
				</div>
 
 
				<div class="equal width fields">
 
					<div class="field" >
 
						<label>Jour</label> 
						<input name="jour" placeholder="jour" type="text"  />
 
					</div>
 
					<div class="field" >
 
						<label>Mois</label> 
						<input name="mois" placeholder="mois" type="text"  />
 
					</div>
 
					<div class="field" >
 
						<label>Année</label> 
						<input name="annee" placeholder="année" type="text"  />
 
					</div>
 
				</div>
 
 
				<br />
 
				<div class="field">
 
					<button class="negative ui button" type="reset">Annuler</button>
					<button class="positive ui button" type="submit">Enregistrer</button>
 
				</div>
 
 
 
		</fieldset>
 
		</div>
 
 
		</div>
 
 
		</div>
 
		</form>
 
		</div>
 
  </body>
 
</html>

et la page js :

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
 
function getXhr(){
 
	var xhr = null ;
 
	if(window.XMLHttpRequest)
 
		xhr = new XMLHttpRequest ;
 
	else if(window.ActiveXObject)
 
		{
			try
			{
 
				xhr = new ActiveXObject("Msxml2.XMLHTTP");
 
			}
 
			catch(e)
			{
 
				xhr = new ActiveXObject('Microsoft.XMLHTTP');
 
			}
 
		}
 
	else
 
		{
 
			alert('merde ton navigateur il trop chelou');
			xhr = false ;
		}
 
 
	return xhr ;
 
}
 
 
 
function requestProjet(oSelect){
 
	var xhr = getXhr();
	var value = oSelect.options[oSelect.selectedIndex].value;
 
 
	xhr.onreadystatechange = function() {
 
		if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)){
 
			readData(xhr.responseXML);
			document.getElementById("loader").style.display = "none";
		}
 
		else if (xhr.readyState < 4){
 
			document.getElementById("loader").style.display =  "inline" ;
		}
 
		xhr.open("POST", "list_projet_by_id.php", true);
 
		xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 
		xhr.send("EXE_CODE="+value) ;
	}
 
 
}
 
 
function readData (oData){
 
	var nodes = oData.getElementsByTagName("item");
	var oSelect = document.getElementById("projet");
	var oOption , oInner;
 
	oSelect.innerHTML = "";
 
	for (var i=0, c=nodes.length; i<c; i++){
 
		oOption = document.createElement("option");
		oInner = document.createTextNode(nodes[i].getAttribute("PRJ_LIB"));
		oOption.value = nodes[i].getAttribute("PRJ_CODE");
 
		oOption.appendChild(oInner);
 
        oSelect.appendChild(oOption);
	}
}

[NoSmoking]

As tu vérifié que tu recevais les data au bon format et que dans ta fonction readData (oData) tu générais le bon HTML.

[dride]

j'ai verifiée je recois effecticement les elements dans leformats souhaité mais concernant la fonction readDate(oData) j ai juste suivi le tuto

[andry.aime]

Installe Firebug et raconte nous ce qu'il dit.

[dride]

verifier avec firebug je vois aucune erreur . cependant quand je débogue pas je remarque qu'il n'entre pas dans ma fonction

Code :

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

readData(oData)

je sais plus trop quoi faire

[NoSmoking]

Est ce à dire que tu n'obtiens rien dans la console si tu écris

Code :

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

1
2
3
function readData(oData) {
  console.log( oData);
  // la suite

[dride]

oui j'obtient rien dans la console qui m'indique que je suis dans la fonction readData(oData)

[dride]

n'y a t-il pas un autre moyen pour obtenir des listes liées

[NoSmoking]

J'ai un peu de mal à comprendre, tu dis que tu reçois bien les données au bon format mais que tu ne passes pas dans la fonction readData !?!

Il y a par ailleurs un point à souligner :

Code :

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

xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

ne devrait-il pas mieux être

Code :

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

xhr.setRequestHeader("Content-Type", "text/xml")

n'y a t-il pas un autre moyen pour obtenir des listes liées

on peut parfois faire plus simple sans Ajax :
Créer des listes déroulantes liées entre elles sans utiliser Ajax

[dride]

en faite quand j'utilise fireburg il n'y a pas la fonction fonction post dans la console . j'en deduit qu'ilne fait pas le post
consernant lien que tu as mis je veux afficher les elements de ma base de données

[NoSmoking]

j'en deduit qu'ilne fait pas le post

Pour FireFox : Faire F12 puis regarder dans l'onglet Réseau.

consernant lien que tu as mis je veux afficher les elements de ma base de données

rien ne t'empêche de « construire une variable » à partir de ta base si la quantité de données est raisonnable.

[dride]

Pour FireFox : Faire F12 puis regarder dans l'onglet Réseau

j'ai verifié il n' y a rien qui se passe