Discussion :

[nabil.brarou]

Bonjour,

J'essai de remplir une liste déroulante à partir d'une autre en utilisant Ajax,
Firebug me donne une erreur au niveau de ma fonction Ajax.
code javascript:

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
 
// code javasscript pour lévenement onchange dans la liste déroulante de départ
// traitement Ajax
function change(){
	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;
	}
 
	var xhr = getXhr();
	// On défini ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function()
	{
			var rst = xhr.responseXML;
			var items = rst.getElementsByTagName('element');
			document.getElementById('ajax_list').options.length= 0;
			for (var i=0; i<items.lenght;i++){
					var myOption = new Option(items[i].getElementsByTagName('option')[0].firstChild.nodeValue,items[i].getElementsByTagName('valeur')[0].firstChild.nodeValue,false,true);
					document.getElementById('ajax_list').options[i]= myOption;
			}
 
	}
 
	// Ici on va voir comment faire du post
	xhr.open("POST","traitement_ajax.php",true);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// ne pas oublier de poster les arguments
 
	zonage = document.getElementById('zonage_administratif');
	zonage_value = zonage.options[zonage.selectedIndex].value;
	xhr.send("zonage_value="+zonage_value);
}
</script>

Code html:

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
<!-------------La liste de départ ------------->
	<select id ="zonage_administratif" name ="liste" style="width: 16em" onchange="change()">
		<option id="Commune" value = "com_nom">commune</option>
		<option id="EPCI"    value = "epci_nom">EPCI</option>
		<option id="PAYS" 	 value = "pays_nom">Pays</option>
		<option id="PNR"  	 value = "pnr_nom">PNR</option>
	</select>
</div></br>
<!--Liste à remplir--->
 
<div id="Ajax_list">
	<label id ="label1"></label>&nbsp;
	<select id="ajax_list" name="ajax_list" style="width: 16em" >
		<option></option>
	</select>

Code php: traitement_ajax.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
 
<?php
        require_once('config.php');
        
        header("Content-type:text/xml");
        
        // si zonage_value est celui de pnr
        if(isset($_POST["zonage_value"]) && $_POST['zonage_value']== "pnr_nom")
        { 
        
                // recherche de pnr par pnr_nom
                $sql = "SELECT pnr_nom,gez_id_geom_zonage FROM $TablePNR_nom order by pnr_nom"; 
                                                                                
                // on envoie la requête
                $req = pg_query($db,$sql)or die ('Requete invalide:'.pg_last_error());
                                                                                
                // on fait une boucle qui va faire un tour pour chaque enregistrement
                while($data = pg_fetch_assoc($req) )
                        {
 
                
                //echo "<option  value=".$data['gez_id_geom_zonage'].">".$data['pnr_nom']."</option>";
                
                echo '<element>';
                echo "<option>".$data['pnr_nom']."</option>";
        echo '<valeur>'.$data['gez_id_geom_zonage'].'</valeur>';
                echo '</element>';
                        }
        }
        // si zonage_value est celui de commune
        elseif($_POST['zonage_value']== "com_nom")
        {
                        
        
                // recherche de la commune par code_insee
                $sql = "SELECT com_nom,com_insee FROM $TableCommunes_nom order by com_nom"; 
                                                                
                // on envoie la requête
                $req = pg_query($db,$sql)or die ('Requete invalide:'.pg_last_error());
                                                                
                // on fait une boucle qui va faire un tour pour chaque enregistrement
                while($data = pg_fetch_assoc($req) )
                {
                // on récupère le code de la commune choisie et on affiche le nom 
                echo '<element>';                                                               
        echo "<option  value=".$data['com_insee'].">".$data['com_nom']."  (".$data['com_insee'].")</option>";
                echo '</element>';
                }
        }
        
        // si zonage_value est celui de pays
        elseif($_POST['zonage_value']== "pays_nom")
        {
                
                $sql = "SELECT pays_nom,gez_id_geom_zonage FROM $TablePays_nom order by pays_nom"; 
                                                                        
                // on envoie la requête
                $req = pg_query($db,$sql)or die ('Requete invalide:'.pg_last_error());
                                                                        
                // on fait une boucle qui va faire un tour pour chaque enregistrement
                while($data = pg_fetch_assoc($req) )
                        {
                        // on récupère le code de la commune choisie et on affiche le nom 
                        echo '<element>';                                                               
                        echo "<option  value=".$data['gez_id_geom_zonage'].">".$data['pays_nom']."</option>";
                        echo '</element>';
                        }
        }
                                                                                                
        // si zonage_value est celui de EPCI 
        elseif($_POST['zonage_value']== "epci_nom")
        {
                                
                $sql = "SELECT epci_nom,gez_id_geom_zonage FROM $TableEPCI_nom order by epci_nom";                                                                      
                // on envoie la requête
                $req = pg_query($db,$sql)or die ('Requete invalide:'.pg_last_error());
                                                                        
                // on fait une boucle qui va faire un tour pour chaque enregistrement
                while($data = pg_fetch_assoc($req) )
                {
                // on récupère le code de la commune choisie et on affiche le nom 
                echo '<element>';                                                                       
                echo "<option  value=".$data['gez_id_geom_zonage'].">".$data['epci_nom']."</option>";
                echo '</element>';
                }
        }
?>

L'erreur affichée par firebug : est rst is null
var rst = xhr.responseXML;

Je récupère les résultats sous forme XML mais je récupère rien dans ma liste !

[andry.aime]

Bonjour,

Sort la fonction getXhr de la fonction change().

A+.