Discussion :

[Sergio_zero]

Bonjour a tous.
j'ai besoin de faire quatre listes liées pour mon site mais voila je bloque sur le xhr.send
J'ai suivi un tuto sur un site mais ce tuto explique comment faire pour faire deux listes.
J'ai modifié ce tuto pour l'adapter à mon besoin, j'ai commencé par faire trois listes et ça fonctionne presque.
Le souci c'est lors de la sélection de la deuxième liste le résultat qui devrait s'afficher dans le troisième select s'affiche dans le deuxième.
Je pense que cela fin du xhr.send que je déclare dans ma fonction request.
Je met mon script si vous pouvez me donner un coup de main ce serai sympas.
page cartouches_generiques.php le JS DANS le HEAD

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
 
<script type="text/javascript" src="<?php echo ROOTPATH; ?>/js/oXHR.js"></script>
				<script type="text/javascript">
				<!-- 
				function request(oSelect) {
					var valuetype = oSelect.options[oSelect.selectedIndex].value;
					var xhr   = getXMLHttpRequest();
 
					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","<?php echo ROOTPATH; ?>/insert/ajax_type_generique.php",true);
					xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
					xhr.send("IdEditor=" + valuetype);
				}
				function requestmarque(oSelectmarque) {
					var valuemarque = oSelectmarque.options[oSelectmarque.selectedIndex].value;
					var xhr   = getXMLHttpRequest();
 
					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","<?php echo ROOTPATH; ?>/insert/ajax_marque_generique.php",true);
					xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
					xhr.send("IdMarque="+valuemarque);
 
				}
				function readData(oData) {
					var nodes   = oData.getElementsByTagName("item");
					var oSelect = document.getElementById("softwaresSelect");
					var oSelectmarque = document.getElementById("gammeSelect");
					var oOption, oInner;
					var oOptionmarque, oInnermarque;
 
					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);
					}
					oSelectmarque.innerHTML = "";
					for (var i=0, c=nodes.length; i<c; i++) {
						oOptionmarque = document.createElement("option");
						oInnermarque  = document.createTextNode(nodes[i].getAttribute("name"));
						oOptionmarque.value = nodes[i].getAttribute("id");
 
						oOptionmarque.appendChild(oInnermarque);
						oSelect.appendChild(oOptionmarque);
					}
				}
				//-->
                 </script>

DANS le BODY

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
 
<fieldset>
	<legend>Recherchez votre produit générique par sélection</legend>
		<select id="editorsSelect" onchange="request(this);">
				<option value="none">Sélectionnez le type : </option>
				<?php                                   
                                        connexionbdd();                                 
                                        $query = mysql_query("SELECT DISTINCT TYPE FROM cartouche_generique ORDER BY TYPE");
                                        while ($back = mysql_fetch_assoc($query)) {
                                                echo "\t\t\t\t<option value=\"" . $back["TYPE"] . "\">" . $back["TYPE"] . "</option>\n";
                                        }
                                ?>			
			</select>
			<span id="loader" style="display: none;"><img src="images/loader.gif" alt="loading" /></span>
 
			<select id="softwaresSelect" onchange="requestmarque(this);">
			<option value="none">Sélectionnez la marque : </option>
			</select>
			<select id="gammeSelect" onchange="requestgamme(this);">
			<option value="none">Sélectionnez la gamme</option>
			</select>
</fieldset>

la page ajax_type_generique.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
 
<?php
header("Content-Type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
echo "<list>";
$idEditor = (isset($_POST["IdEditor"])) ? htmlspecialchars($_POST["IdEditor"]) : NULL;
if ($idEditor) {
        mysql_connect("***","***","***");
                mysql_select_db("***");
        $query = mysql_query("SELECT DISTINCT marque FROM cartouche_generique WHERE TYPE='".$idEditor."' ORDER BY marque");
        while ($back = mysql_fetch_assoc($query)) {
                echo "<item id=\"".$back["marque"] . "\" name=\"" . $back["marque"] . "\" />";
        }
}
echo "</list>";
?>

la page ajax_marque_generique.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
 
<?php
header("Content-Type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
echo "<list>";
$idMarque = (isset($_POST["IdMarque"])) ? htmlspecialchars($_POST["IdMarque"]) : NULL;
if ($idMarque) {
        mysql_connect("***","***","***");
                mysql_select_db("***");
        $query = mysql_query("SELECT DISTINCT gamme FROM cartouche_generique WHERE marque='".$idMarque."' ORDER BY gamme");
        while ($back = mysql_fetch_assoc($query)) {
                echo "<item id=\"".$back["gamme"] . "\" name=\"" . $back["gamme"] . "\" />";
        }
}
echo "</list>";
?>

En espérant que quelqu'un me vienne en aide, je cherche depuis un bon moment.

[NoSmoking]

Bonjour,

Le souci c'est lors de la sélection de la deuxième liste le résultat qui devrait s'afficher dans le troisième select s'affiche dans le deuxième.

c'est ce que tu demandes je présume dans ta fonction readData, on trouve oSelect.appendChild(oOption); puis oSelect.appendChild(oOptionmarque);

[Sergio_zero]

Merci beaucoup, c'était bien ça.
il y en avait d'autre du coup j'ai multiplié mes fonctions.
Je te remercie beaucoup d'avoir pris le temps de m'aider.