[AJAX] 3 Listes liées en AJAX

**titinesaku** · 21/04/2009, 12h35

Bonjour,

J'essaye de lier 3 listes générées par une base de données. Jusqu'à maintenant j'ai réussis à lier deux listes : type_formation et niveau_formation. Cependant j'aimerai que niveau_formation soit lié à une autre liste qui est specification_formation. Voici le code que j'ai mis en place mais qui ne fonction que pour les 2 premières listes

menu.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
<html>
 
	<head>
 
		<title>Inscription</title>
 
		<script type='text/javascript'>
 
			function getXhr()
			{
				var xhr = null;
 
				if(window.XMLHttpRequest)// Firefox et autres
				{
					xhr = new XMLHttpRequest(); 
				}
				else if(window.ActiveXObject)// Internet Explorer 
				{
					try
					{
						xhr = new ActiveXObject("Msxml2.XMLHTTP");
					}
					catch(e)
					{
						xhr = new ActiveXObject("Microsoft.XMLHTTP");
					}
				}
				else // XMLHttpRequest non supporté par le navigateur 
				{
					alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest");
					xhr = false;
				}
 
				return xhr;
			}
 
			function go_niveau()
			{
				var xhr = getXhr();
 
				xhr.onreadystatechange = function()
				{
					if(xhr.readyState == 4 && xhr.status == 200)
					{
						leselect = xhr.responseText;
 
						document.getElementById('niveau').innerHTML = leselect;
					}
				}
 
				xhr.open("POST","menu_niveau.php",true);
 
				xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
 
				sel = document.getElementById('type');
 
				id_type_formation_menu = sel.options[sel.selectedIndex].value;
 
				xhr.send("id_type_formation_menu="+id_type_formation_menu);
			}
 
		</script>
 
	</head>
 
	<body>
 
		<form>
 
			<select name="type_formation" id="type" onchange="go_niveau()">
 
				<option value="-1" selected="selected">Autre</option>
 
				<?php
 
					$Id = mysql_connect('localhost','root',"");
 
					mysql_select_db("suiviautorisation",$Id);
 
					$ReqSQL = "SELECT * FROM `type_formation_menu` ORDER BY `id_type_formation_menu`";
 
					$Res = mysql_query($ReqSQL);
 
					if($Res == false)
					{
						echo ("Erreur requete");
					} 
					while ($Ligne = mysql_fetch_array($Res))
					{
						echo("<option value=\"".$Ligne["id_type_formation_menu"]."\">".$Ligne["type_formation_menu"]."</option>");
					}
 
					mysql_close($Id);
 
				?>
 
			</select>
 
			<div id="niveau">
 
				<select name="niveau_formation">
 
					<option value="-1" selected="selected">Autre</option>
 
				</select>
 
			</div>
 
			<div id="specification">
 
				<select name="specification_formation">
 
					<option value="-1" selected="selected">Autre</option>
 
				</select>
 
			</div>
 
		</form>
 
	</body>
 
</html>

menu_niveau.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
<script>
 
	function go_specification()
	{
		var xhr = getXhr();
 
		xhr.onreadystatechange = function()
		{
			if(xhr.readyState == 4 && xhr.status == 200)
			{
				leselect = xhr.responseText;
 
				document.getElementById('specification').innerHTML = leselect;
			}
		}
 
		xhr.open("POST","menu_specification.php",true);
 
		xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
 
		sel = document.getElementById('niveau');
 
		id_niveau_formation_menu = sel.options[sel.selectedIndex].value;
 
		xhr.send("id_niveau_formation_menu="+id_niveau_formation_menu);
	}
 
</script>
 
<?php
 
	echo ("<select name=\"niveau_formation\" id=\"niveau\" onchange=\"go_specification()\">");
 
	if(isset($_POST["id_type_formation_menu"]))
	{
		$id_type_formation_menu = $_POST["id_type_formation_menu"];
 
		$Id = mysql_connect("localhost","root","");
 
		mysql_select_db("suiviautorisation",$Id);
 
		$ReqSQL = "SELECT * FROM `niveau_formation_menu` WHERE `id_type_formation_menu` = '$id_type_formation_menu' ORDER BY `id_niveau_formation_menu`";
 
		$Res = mysql_query($ReqSQL);
 
		if($Res == false)
		{
			echo ("Erreur requete");
		} 
		while ($Ligne = mysql_fetch_array($Res))
		{
			echo("<option value=\"".$Ligne["id_niveau_formation_menu"]."\">".$Ligne["niveau_formation_menu"]."</option>");
		}
 
		mysql_close($Id);
 
	}
 
	echo "</select>";
 
?>

menu_specification.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
<?php
 
	echo ("<select name=\"specification_formation\">");
 
		if(isset($_POST["id_niveau_formation_menu"]))
		{
			$id_niveau_formation_menu = $_POST["id_niveau_formation_menu"];
 
			$Id = mysql_connect("localhost","root","");
 
			mysql_select_db("suiviautorisation",$Id);
 
			$ReqSQL = "SELECT * FROM `specification_formation_menu` WHERE `id_niveau_formation_menu` = '$id_niveau_formation_menu' ORDER BY `id_specification_formation_menu`";
 
			$Res = mysql_query($ReqSQL) or die(mysql_error());
 
			if($Res == false)
			{
				echo ("Erreur requete");
			} 
			while ($Ligne = mysql_fetch_array($Res))
			{
				echo("<option value=\"".$Ligne["id_specification_formation_menu"]."\">".$Ligne["specification_formation_menu"]."</option>");
			}
 
			mysql_close($Id);
		}
 
	echo "</select>";
 
?>

Merci de votre aide

**E.Bzz** · 21/04/2009, 12h45

Bonjour,
tu ne récupères pas le paramètre correctement (tu pointes sur le div, au lieu du select qu'il contient

):

Code :

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

1
2
3
sel = document.getElementById('niveau_formation');
id_niveau_formation_menu = sel.options[sel.selectedIndex].value;
xhr.send("id_niveau_formation_menu="+id_niveau_formation_menu);

avec

Code :

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

<select id="niveau_formation" name="niveau_formation">

A+

**titinesaku** · 21/04/2009, 12h54

Mais en fait il pointait vers le bon endroit. En effet dans menu_niveau.php il y a

Code :

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

echo ("<select name=\"niveau_formation\" id=\"niveau\" onchange=\"go_specification()\">");

juste avant le if. Le select de niveau est généré depuis menu_niveau.php. C'est sûrement un autre souci car même en mettant le même id partout comme tu me le conseille, cela ne change pas.

**E.Bzz** · 21/04/2009, 12h59

Envoyé par titinesaku

C'est sûrement un autre souci

Dans ce cas, oui : ton id="niveau" est dupliqué (c'est déjà celui du div)

A+

**titinesaku** · 21/04/2009, 17h36

Finalement en mettant les niveaux et spécifications dans le même fichier ça fonctionne. Pourtant il me reste un petit souci : j'aimerai pouvoir récupérer l'id_niveau (de la ligne 23, celui sélectionné par l'utilisateur) pour le mettre en condition dans les requêtes (exemple ligne 44) pour les spécifications. Voici le nouveau 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
<?php
 
	echo ("<select name=\"niveau_formation\" id=\"niveau_formation\" onchange=\"go_specification()\">");
 
	if(isset($_POST["id_type_formation_menu"]))
	{
		$id_type_formation_menu = $_POST["id_type_formation_menu"];
 
		$Id = mysql_connect("localhost","root","");
 
		mysql_select_db("suiviautorisation",$Id);
 
		$ReqSQL = "SELECT * FROM `niveau_formation_menu` WHERE `id_type_formation_menu` = '$id_type_formation_menu' ORDER BY `id_niveau_formation_menu`";
 
		$Res = mysql_query($ReqSQL);
 
		if($Res == false)
		{
			echo ("Erreur requete");
		} 
		while ($Ligne = mysql_fetch_array($Res))
		{
			echo("<option value=\"".$Ligne["id_niveau_formation_menu"]."\">".$Ligne["niveau_formation_menu"]."</option>");
		}
 
		mysql_close($Id);
 
	}
 
	echo "</select><br/>";
 
	echo ("<select name=\"specification_formation_1\">");
 
	if(isset($_POST["id_type_formation_menu"]))
	{
		$id_type_formation_menu = $_POST["id_type_formation_menu"];
 
		$Id = mysql_connect("localhost","root","");
 
		mysql_select_db("suiviautorisation",$Id);
 
		$ReqSQL = "SELECT * FROM `specification_formation_menu` 
					WHERE `id_type_formation_menu` = '$id_type_formation_menu'
					AND `id_niveau_formation_menu` = '$id_niveau_formation_menu'
					ORDER BY `id_specification_formation_menu`";
 
		$Res = mysql_query($ReqSQL);
 
		if($Res == false)
		{
			echo ("Erreur requete");
		} 
		while ($Ligne = mysql_fetch_array($Res))
		{
			echo("<option value=\"".$Ligne["id_specification_formation_menu"]."\">".$Ligne["specification_formation_menu"]."</option>");
		}
 
		mysql_close($Id);
 
	}
 
	echo "</select><br/>";
 
	echo ("<select name=\"specification_formation_2\">");
 
	if(isset($_POST["id_type_formation_menu"]))
	{
		$id_type_formation_menu = $_POST["id_type_formation_menu"];
 
		$Id = mysql_connect("localhost","root","");
 
		mysql_select_db("suiviautorisation",$Id);
 
		$ReqSQL = "SELECT * FROM `specification_formation_menu` 
			WHERE `id_type_formation_menu` = '$id_type_formation_menu'
			AND `id_niveau_formation_menu` = '$id_niveau_formation_menu'
			ORDER BY `id_specification_formation_menu`";
 
		$Res = mysql_query($ReqSQL);
 
		if($Res == false)
		{
			echo ("Erreur requete");
		} 
		while ($Ligne = mysql_fetch_array($Res))
		{
			echo("<option value=\"".$Ligne["id_specification_formation_menu"]."\">".$Ligne["specification_formation_menu"]."</option>");
		}
 
		mysql_close($Id);
 
	}
 
	echo "</select><br/>";
 
	echo ("<select name=\"specification_formation_3\">");
 
	if(isset($_POST["id_type_formation_menu"]))
	{
		$id_type_formation_menu = $_POST["id_type_formation_menu"];
 
		$Id = mysql_connect("localhost","root","");
 
		mysql_select_db("suiviautorisation",$Id);
 
		$ReqSQL = "SELECT * FROM `specification_formation_menu` 
				WHERE `id_type_formation_menu` = '$id_type_formation_menu'
				AND `id_niveau_formation_menu` = '$id_niveau_formation_menu'
				ORDER BY `id_specification_formation_menu`";
 
		$Res = mysql_query($ReqSQL);
 
		if($Res == false)
		{
			echo ("Erreur requete");
		} 
		while ($Ligne = mysql_fetch_array($Res))
		{
			echo("<option value=\"".$Ligne["id_specification_formation_menu"]."\">".$Ligne["specification_formation_menu"]."</option>");
		}
 
		mysql_close($Id);
 
	}
 
	echo "</select>";
 
?>

**E.Bzz** · 21/04/2009, 17h51

Si tu te retrouves toujours avec 2 id="niveau" dans ta page, tu auras quand même des problèmes ...

A+

[AJAX] 3 Listes liées en AJAX

AJAX

Vue hybride

Discussions similaires

Partager

Partager