Problème avec liste déroulante

fourniey · 04/01/2008, 17h53

Bonjour à tous,

Mon objectif est d'avoir deux listes déroulantes pour afficher un groupe de personnes : une permet de choisir un comité et l'autre de sélectionner l'année désirée sans recharger la page.

Peu importe la sélection du comité, la liste pour l'année est toujours vide.

Merci de votre aide!

Code principal:

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
<html>
	<head>
		<title>Liste déroulante</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;
			}
 
 
 
			/*** Méthode qui sera appelée sur le click du bouton */
			function change(){
 
				var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					alert(xhr.readyState);
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						di = document.getElementById('livre');
						di.innerHTML = xhr.responseText;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","ca1_an.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
				// ici, l'id de l'auteur
				idauteur = document.getElementById('auteur').options[document.getElementById('auteur').selectedIndex].value;
				//alert(idauteur);
				xhr.send("idAuteur="+idauteur);
 
			}
		</script>
	</head>
	<body>
		<form>
			<fieldset style="width: 500px">
				<legend><strong>Critères de sélection</strong></legend>
				<label>Comité</label>
				<select name='auteur' id='auteur' onchange='change()'>
					<option value='-1'>Aucun</option>
					<?php
						require("../config.inc.php");
						$res = mysql_query("SELECT * FROM TB_statut ORDER BY description");
						while($row = mysql_fetch_assoc($res)){
							echo "<option value='".$row["id"]."'>".$row["description"]."</option>";
						}
					?>
				</select>
				<label>Année</label>
				<div id='livre' style='display:inline'>
				<select name='livre'>
					<option value='-1'>Choisir un comité</option>
				</select>
				</div>
			</fieldset>
		</form>
	</body>
</html>

Code pour l'année:

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
<?php
 
//echo 'entrer';
//echo $_REQUEST["idAuteur"];
 
echo $_POST["idAuteur"];
 
	echo "<select name='livre'>";
	if(isset($_REQUEST["idAuteur"])){
		echo 'Passer';
		require("../config.inc.php");
		$res = mysql_query("SELECT id,an FROM ATS_statut WHERE type=".$_REQUEST["idAuteur"]." ORDER BY an");
		while($row = mysql_fetch_assoc($res)){
			echo "<option value='".$row["id"]."'>".$row["an"]."</option>";
		}
	}
	else
		echo "<option value='-1'>Choisir un comité</option>";
	echo "</select>";
?>

psylox · 07/01/2008, 15h01

Citation:

Envoyé par fourniey

function change()
{
idauteur = document.getElementById('auteur').options[document.getElementById('auteur').selectedIndex].value;
}

<select name='auteur' id='auteur' onchange='change()'>

remplace par :

Code :

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

1
2
3
4
5
6
7
 
function change(idauteur)
{
}
 
 
<select name='auteur' id='auteur' onchange='change(this.selectedIndex.value)'>

Code :

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

1
2
3
4
5
if(isset($_POST['idAuteur'])){
		echo 'Passer';
		require("../config.inc.php");
		$res = mysql_query("SELECT id,an FROM ATS_statut WHERE type=".$_POST['idAuteur']." ORDER BY an");

fourniey · 07/01/2008, 18h56

Merci pour ta réponse. J'obtiens cette erreur: undefined et la liste est vide.

J'espère avoir apporté les corrections correctement. Voic le 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
<html>
	<head>
		<title>Liste déroulante</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;
			}
 
 
 
			/**
			* Méthode qui sera appelée sur le click du bouton
			*/
			function change(idauteur)
			{
				var xhr = getXhr();
 
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function()
				{
					alert(xhr.readyState);
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						di = document.getElementById('livre');
						di.innerHTML = xhr.responseText;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST","ajaxLivre.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
				// ici, l'id de l'auteur
				//idauteur = document.getElementById('auteur').options[document.getElementById('auteur').selectedIndex].value;
				//alert(idauteur);
				xhr.send("idAuteur="+idauteur);
			}
		</script>
	</head>
	<body>
		<form>
			<fieldset style="width: 500px">
				<legend><strong>Liste disponible</strong></legend>
				<label>Comité</label>
					<select name='auteur' id='auteur' onchange='change(this.selectedIndex.value)'>
					<option value='-1'>Aucun</option>
					<?php
						require("../config.inc.php");
						$res = mysql_query("SELECT * FROM TB_statut where web_site='O' ORDER BY description");
						while($row = mysql_fetch_assoc($res)){
							echo "<option value='".$row["ca"]."'>".$row["description"]."</option>";
						}
					?>
				</select>
				<label>Année</label>
				<div id='livre' style='display:inline'>
				<select name='livre'>
					<option value='-1'>Choisir une année</option>
				</select>
				</div>
			</fieldset>
		</form>
	</body>
</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
16
17
18
19
 
<?php
 
//echo $_REQUEST["idAuteur"];
 
	echo "<select name='livre'>";
 
	if(isset($_POST['idAuteur'])){
		echo 'Passer';
		require("../config.inc.php");
		$res = mysql_query("SELECT id,an FROM ATS_statut WHERE type=".$_POST['idAuteur']." ORDER BY an");
		while($row = mysql_fetch_assoc($res)){
			echo "<option value='".$row["id"]."'>".$row["titre"]."</option>";
		}
	}
	else
		echo "<option value='-1'>Choisir un auteur</option>";
	echo "</select>";
?>

psylox · 11/01/2008, 18h22

Qu'est-ce qui est undefined? l'idAuteur ou bien la réponse ?
as tu essayé un alert(xhr.responseText); ?

fourniey · 11/01/2008, 20h24

On dirait que le post ne fonctionne pas.

La variable idauteur est vide quand je passe dans le fichier t1a.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
<html>
	<head>
		<title>Liste déroulante</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;
			}
 
 
			/** Méthode qui sera appelée sur le click du bouton	*/
			function change(idauteur)
			{
				var xhr = getXhr();
 
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function()
				{
					alert(xhr.readyState);
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						di = document.getElementById('livre');
						di.innerHTML = xhr.responseText;
					}
				}
 
				xhr.open("POST","t1a.php",true);
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments (id de l'auteur)
				//idauteur = document.getElementById('auteur').options[document.getElementById('auteur').selectedIndex].value;
				//alert(idauteur);
				xhr.send("idAuteur="+idauteur);
			}
		</script>
	</head>
	<body>
		<form>
			<fieldset style="width: 500px">
				<legend><strong>Liste disponible</strong></legend>
				<label>Comité</label>
					<select name='auteur' id='auteur' onchange='change(this.selectedIndex.value)'>
					<option value='-1'>Aucun</option>
					<?php
						require("../config.inc.php");
						$res = mysql_query("SELECT * FROM TB_statut where web_site='O' ORDER BY description");
						while($row = mysql_fetch_assoc($res)){
							echo "<option value='".$row["ca"]."'>".$row["description"]."</option>";
						}
					?>
				</select>
				<label>Année</label>
				<div id='livre' style='display:inline'>
				<select name='livre'>
					<option value='-1'>Choisir une année</option>
				</select>
				</div>
			</fieldset>
		</form>
	</body>
</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
16
17
18
<?php
 
//echo $_REQUEST["idAuteur"];
//alert(xhr.responseText);
 
echo "<select name='livre'>";
	if(isset($_POST['idAuteur'])){
		echo 'Passer';
		require("../config.inc.php");
		$res = mysql_query("SELECT id,an FROM ATS_statut WHERE type=".$_POST['idAuteur']." ORDER BY an");
		while($row = mysql_fetch_assoc($res)){
			echo "<option value='".$row["id"]."'>".$row["titre"]."</option>";
		}
	}
	else
		echo "<option value='-1'>Choisir un auteur</option>";
	echo "</select>";
?>

psylox · 12/01/2008, 20h58

essaye de faire un alert(idAuteur) dans ta fonction ajax , j'ai peut-etre oublié kkchoz dans le passage de parametres a cette fonction.

Edit: En effet, si tu cherchais un peu tu aurais trouvé "this.selectedIndex has no properties" donc tu enlèves le .value que le suit.
Un conseil si ce n'est pas déja le cas, je te recommande vivement l'utilisation de plugin firefox tel que webdevelopper ou firebug.

fourniey · 13/01/2008, 04h14

Je vais tester ce que tu mentionnes... Merci!

Pour ce qui est de Firefox, j'ai la version 3.0 béta alors les plugin ne fonctionne pas.

11/01/2008, 18h22	#4
psylox Membre confirmé Benjamin Rouxel Développeur informatique Inscription : avril 2007 Messages : 238 Détails du profil Informations personnelles : Nom : Benjamin Rouxel Âge : 25 Localisation : France, Côtes d'Armor (Bretagne) Informations professionnelles : Activité : Développeur informatique Informations forums : Inscription : avril 2007 Messages : 238 Points : 228 Points : 228	Qu'est-ce qui est undefined? l'idAuteur ou bien la réponse ? as tu essayé un alert(xhr.responseText); ? __________________ Linux because rebooting is just for adding medias
	00

12/01/2008, 20h58	#6
psylox Membre confirmé Benjamin Rouxel Développeur informatique Inscription : avril 2007 Messages : 238 Détails du profil Informations personnelles : Nom : Benjamin Rouxel Âge : 25 Localisation : France, Côtes d'Armor (Bretagne) Informations professionnelles : Activité : Développeur informatique Informations forums : Inscription : avril 2007 Messages : 238 Points : 228 Points : 228	essaye de faire un alert(idAuteur) dans ta fonction ajax , j'ai peut-etre oublié kkchoz dans le passage de parametres a cette fonction. Edit: En effet, si tu cherchais un peu tu aurais trouvé "this.selectedIndex has no properties" donc tu enlèves le .value que le suit. Un conseil si ce n'est pas déja le cas, je te recommande vivement l'utilisation de plugin firefox tel que webdevelopper ou firebug. __________________ Linux because rebooting is just for adding medias
	00

13/01/2008, 04h14	#7
fourniey Membre du Club Yvan Fournier Inscription : juin 2005 Messages : 234 Détails du profil Informations personnelles : Nom : Yvan Fournier Informations forums : Inscription : juin 2005 Messages : 234 Points : 41 Points : 41	Je vais tester ce que tu mentionnes... Merci! Pour ce qui est de Firefox, j'ai la version 3.0 béta alors les plugin ne fonctionne pas.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email