Remplir une liste déroulante à partir d'une autre liste dynamique

**Sekigawa** · 22/12/2008, 15h35

Salut,

Voilà je vois pas du tout comment faire,

J'ai une liste déroulante qui contient des catégories de produits et une autre qui doit contenir les produits correspondant à la catégorie choisie.

Je voudrai que quand l'utilisateur fait son choix dans la premiere liste, la seconde soit remplie dynamiquement. Le soucie c'est que je voudrai que ça se fasse sans rafraichissement en dynamique quoi lol

Merci pour vos réponses !!

**islyoung2** · 22/12/2008, 15h49

Ahh mon pote je pense que tu dois faire un tour chez Mr AJAX pour remédier a ton PB.

**Sekigawa** · 22/12/2008, 15h52

Un petit coup de main pour trouver ça ^^

Je cherche depuis un moment ans un résultat !! PLEASE !!

**islyoung2** · 22/12/2008, 15h54

Ok pas de pb, j'ai un script simple qui fais exactement ce que tu cherche chez moi, si tu veux je te l'envoie ce soir.

**Sekigawa** · 22/12/2008, 15h57

Oua ce serait enorme

Je te laisse mon mail par MP !!

Je te remercie vraiment !!!!

**islyoung2** · 22/12/2008, 15h58

No problrmo à ce soir alors

**Stéph utilisateur d'acces** · 23/12/2008, 15h35

salut islyoung2

je cherche la même chose;

peux tu mettre ton script pout tous où c est trop demandé?

en tout cas merci

steph

**islyoung2** · 23/12/2008, 15h46

Nan c pas du tout trop demandée;
mai en faite le script est sur deux fichier .php un fichier .javascript + un fichier text pour la structure de la base de donnée, mais ne t'en fais pas je vais le mettre.

**islyoung2** · 23/12/2008, 15h58

voila comme promis je vais mettre le script et l'expliquer aussi :
- c'est un petit script qui illustre l'utilité de la puissance de la technologie AJAX (bon un ptit avant gout de la puissance lol).
- je vai commencer par la base de donnée :
j'ai deux tables : auteur, comme son nom l'indique contient un ensemble d'auteurs de boukin. la deuxième table contient tous les ouvrage et pour chaque livre il ya un champ auteur pour référencer l'auteur du livre.
- dans le fichier index il ya deux select un pour les auteur et l'autre pour les ouvrage, mais celui des ouvrage est vide, il faux sélectionner l'auteur afin d'afficher rien que les ouvrage spécifique à cette ouvrage. voila c tous :

fichier : index.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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Livres et auteurs</title>
</head>
 
<body>
<script language="javascript" src="Auteur.js"></script>
<?php
	function AuthorList()
	{
		mysql_connect("localhost","root","") or die(mysql_error());
		mysql_select_db("tpajax") or die(mysql_error());
		$query1 = mysql_query("SELECT * FROM Auteur ORDER BY 'nom'") or die(mysql_error());
		while($result = mysql_fetch_array($query1))
		{
			echo "<option value=".$result['id'].">".$result['nom']."</option>";
		}
		mysql_close();
	}
?>
<fieldset style="width: 500px">
	<legend>Liste liées</legend>
	Auteur :<select id="slcAuteur" onchange="Ajax();">
  		<option value="-1">Aucun</option>
  			<?php AuthorList() ?>
		</select>
	<div id="slcLivre" style="display:inline" >
		Livre :<select  name="slcLivre">
		  <option value="-1">Choisir un auteur</option>
		</select>
	</div>
</fieldset>
<script language="javascript">
Ajax();
//document.getElementById('slcLivre').innerHTML="<select name ='slcLivre'><option value='-1'>Choisir un  auteur</option></select>"
</script>
</body>
</html>

fichier BookFind.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
 
<?php
	//echo "execution bookfind.php";
 
	$idauteur = $_GET['Auteur'];
	if($idauteur !=-1)
	{
 
		mysql_connect("localhost","root","") or die(mysql_error());
		mysql_select_db("tpajax") or die(mysql_error());
		$query1 = mysql_query("SELECT * FROM livre WHERE idAuteur = '$idauteur'")or die(mysql_error());
		echo "Livre : <select  name='slcLivre'>";
		while($result = mysql_fetch_array($query1))
		{
			echo "<option value=".$result['id'].">".$result['titre']."</option>";
		}
		echo "</select> ";
	}
	else
	echo "Livre : <select name ='slcLivre'><option value='-1'>Choisir un auteur</option></select>";
 
?>

fichier Auteur.js :

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
 
function initAjax()
	{
		var xmlHttp;
		try
		{
			// Firefox, Opera 8.0+, Safari
			xmlHttp=new XMLHttpRequest();
		}
		catch (e)
		{
			// Internet Explorer
			try
			{
				xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
			}
			catch (e)
			{
				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
			}
		}
		return xmlHttp ;
	}
function Ajax()
{
		var xmlHttp2=initAjax()
		var idauteur='-1';
		//window.alert("execution ajax");
		xmlHttp2.onreadystatechange=function()
		{
			//window.alert("execution onreadystatechange");
			if(xmlHttp2.readyState == 4 || xmlHttp2.readyState == 0)
			{
				//window.alert("execution onreadystatechange");
				//				window.alert(" avant:"+idauteur);
				document.getElementById('slcLivre').innerHTML = xmlHttp2.responseText;
			}
		}
			sel = document.getElementById('slcAuteur');
			//window.alert(sel.options[sel.selectedIndex].value);
			idauteur = sel.options[sel.selectedIndex].value;
			//window.alert("apres:"+idauteur);
			xmlHttp2.open("GET","BookFind.php?Auteur="+idauteur,true);
			//window.alert("apres1:"+idauteur);
			xmlHttp2.send(null);
}

Nom de la BDD : tpajax
Structure de la BDD :

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
 
CREATE TABLE `auteur` (
`id` tinyint(4) NOT NULL auto_increment,
`nom` varchar(50) NOT NULL,
PRIMARY KEY (`id`)
);
 
insert into `auteur` values
(1,'Clive Cussler'),
(2,'Harlan Coben'),
 
(3,'Franck Herbert'),
(4,'Pierre Bordages');
 
CREATE TABLE `livre` (
`id` tinyint(4) NOT NULL auto_increment,
`titre` varchar(50) NOT NULL,
`idAuteur` tinyint(4) default NULL,
PRIMARY KEY (`id`)
) ;
 
insert into `livre` values
(1,'Odyssee',1),
(2,'Sahara',1),
(3,'Dragon',1),
(4,'Une chance de trop',2),
(5,'Ne le dis a personne',2),
(6,'Disparu à jamais',2),
(7,'Dune',3),
(8,'La barriere de santaroga',3),
(9,'Les guerriers du silence',4),
(10,'La citadelle hyponeros',4),
(11,'Terra mater',4);

**Stéph utilisateur d'acces** · 23/12/2008, 16h05

super je vais regarder ça

en tout cas, on peut dire que tu es rapide à la réponse.

merci beaucoup

a +

steph

**islyoung2** · 23/12/2008, 16h18

EEHHHHH ouai comme koi il reste tjr dans ce bas monde ceux qui aiment aider les autres.

**Celira** · 23/12/2008, 16h42

Et puis c'est mieux de faire partager (après tout c'est à ça que sert un forum...)

Sekigawa, ton problème est résolu ?

**Stéph utilisateur d'acces** · 24/12/2008, 11h09

Salut Islyoung2

j ai testé ton code

j utilise Dreamweaver

j ai donc créé 3 fichiers( index.php,bookfind.php et Auteur.js) et la base de données tpajax

mais quand j execute index.php j ai bien les 2 listes , la liste auteur s'alimente bien avec les auteurs mais que dalle dans la liste livre.

ai je fait une mauvaise mani, j ai copié texto ton code.

merci de ton aide

steph

**islyoung2** · 24/12/2008, 11h12

Mais c'est sa le but du script, c'est que tu ne peut pas choisir un ouvrage avant d'avoir choisi un auteur. et après avoir choisi l'auteur il apparait rien que les ouvrage de cette auteur, tout sa sans avoir besoin à recharger la page.
A moins que la liste des livre ne change pas même si tu choisi un auteur.

**Stéph utilisateur d'acces** · 24/12/2008, 11h26

salut

bin justement il ne se passe rien. j ai maté sur phpmyadmin, j ai bien les 2 tables et la jointure,ok

je clique sur la liste auteur, j ai les noms et quand je clique sur l autre, il me met simplement choisir un auteur mais rien d'autre.

?

**islyoung2** · 24/12/2008, 11h37

Envoyé par Stéph utilisateur d'acces

salut

bin justement il ne se passe rien. j ai maté sur phpmyadmin, j ai bien les 2 tables et la jointure,ok

je clique sur la liste auteur, j ai les noms et quand je clique sur l autre, il me met simplement choisir un auteur mais rien d'autre.
?

Désolé ça marche très bien chez moi avec les deux explorateurs (IE,FF), et même Sekigawa l'a essayé chez lui et ça a marché, vérifie si javascript n'est pas bloqué par ton explorateur.

**Stéph utilisateur d'acces** · 24/12/2008, 11h40

j utilise FF mais il ne me dit rien.

Comment je peux savoir s il bloque le js?

c est bizarre quand même ce truc

merci

**islyoung2** · 24/12/2008, 11h45

Il existe un module complémentaire pour FF il s'appelle Firebug, c'est module pour le développement web, essaye de l'installer et si il y a erreur javascript il va te l'afficher.