[AJAX] la liste déroulante ne montre aucun résultat

**beegees** · 18/11/2008, 16h24

Bonjour,

J'essaie d'apprendre l'AJAX car je dois lier trois listes déroulantes en essayant de ne pas avoir de rechargement de page.

Je me suis donc basé sur ce cours :

http://siddh.developpez.com/articles/ajax/

J'ai copié/collé le code.

J'ai créé la table MYSQL avec le code fourni, j'ai appelé ma bd "test".

Quand j'ouvre la première liste déroulante (Auteurs), je n'obtiens rien.

D'où pensez-vous que le problème peut provenir ?

Merci d'avance.

beegees

**E.Bzz** · 18/11/2008, 16h37

Bonjour,

Envoyé par beegees

D'où pensez-vous que le problème peut provenir ?

De ton code

Montre-le ...

A+

**beegees** · 18/11/2008, 16h40

Envoyé par E.Bzz

Bonjour,De ton code

Montre-le ...

A+

Bonjour,

Merci pour ta réponse rapide :

auteurs.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
<html>
	<head>
		<title>Tutoriel Ajax (XHTML + JavaScript + XML)</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 go(){
				var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// 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){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('livre').innerHTML = leselect;
					}
				}
 
				// 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
				sel = document.getElementById('auteur');
				idauteur = sel.options[sel.selectedIndex].value;
				xhr.send("idAuteur="+idauteur);
			}
		</script>
	</head>
	<body>
		<form>
			<fieldset style="width: 500px">
				<legend>Liste liées</legend>
				<label>Auteurs</label>
				<select name='auteur' id='auteur' onchange='go()'>
					<option value='-1'>Aucun</option>
					<?
						mysql_connect("localhost","root","mdp");
						mysql_select_db("test");
						$res = mysql_query("SELECT * FROM auteur ORDER BY nom");
						while($row = mysql_fetch_assoc($res)){
							echo "<option value='".$row["id"]."'>".$row["nom"]."</option>";
						}
					?>
				</select>
				<label>Livres</label>
				<div id='livre' style='display:inline'>
				<select name='livre'>
					<option value='-1'>Choisir un auteur</option>
				</select>
				</div>
			</fieldset>
		</form>
	</body>
</html>

et ajaxLivre.php

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
        echo "<select name='livre'>";
        if(isset($_POST["idAuteur"])){
                mysql_connect("localhost","root","mdp");
                mysql_select_db("test");
                $res = mysql_query("SELECT id,titre FROM livre 
                        WHERE idAuteur=".$_POST["idAuteur"]." ORDER BY titre");
                while($row = mysql_fetch_assoc($res)){
                        echo "<option value='".$row["id"]."'>".$row["titre"]."</option>";
                }
        }
        echo "</select>";
?>

Qu'en penses-tu ?

Merci encore.

beegees

**E.Bzz** · 18/11/2008, 16h56

Le name de ton 2° select et l'id du div qui le contient peuvent poser problème à IE (qui confond allègrement name et id).
Essaye avec

Code :

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

1
2
3
<select name='les_livres'>
<option value='-1'>Choisir un auteur</option>
</select>

A répercuter dans ton PHP qui remplace ce select ...

A+

**E.Bzz** · 18/11/2008, 16h59

Au fait

Envoyé par beegees

Quand j'ouvre la première liste déroulante (Auteurs), je n'obtiens rien.

tu dois avoir au moins une erreur, soit Javascript (en activant la notification des erreurs de scripts dans ton nav ou en utilisant Firebug ou équivalent), soit PHP (en analysant ton responseText qui doit la récupérer) ...

Ou alors, c'est que les id stockés dans ta table ne correspondent pas à celui envoyé comme paramètre par Ajax ...

A+

**beegees** · 18/11/2008, 17h03

Envoyé par E.Bzz

Le name de ton 2° select et l'id du div qui le contient peuvent poser problème à IE (qui confond allègrement name et id).
Essaye avec

Code :

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

1
2
3
<select name='les_livres'>
<option value='-1'>Choisir un auteur</option>
</select>

A répercuter dans ton PHP qui remplace ce select ...

A+

Envoyé par E.Bzz

Au fait
tu dois avoir au moins une erreur, soit Javascript (en activant la notification des erreurs de scripts dans ton nav ou en utilisant Firebug ou équivalent), soit PHP (en analysant ton responseText qui doit la récupérer) ...

Ou alors, c'est que les id stockés dans ta table ne correspondent pas à celui envoyé comme paramètre par Ajax ...

A+

Salut,

Merci pour ta réponse.

En fait j'utilise toujours firefox.

Je ne comprends pas car c'est un copié collé du code dont j'ai communiqué l'URL, cours de developpez.com.

Je vais essayer de voir avec firebug (que je ne sais pas utiliser) et je te dis quoi.

Edit : y'a-t'il une manipulation à faire avec le firebug ?

Merci encore

beegees

**E.Bzz** · 18/11/2008, 17h24

Dans Firefox, tu as déjà la console d'erreur (menu Outils) ...

A+

[AJAX] la liste déroulante ne montre aucun résultat

JavaScript

Discussions similaires

Partager

Partager