[Conception] Liste déroulante dynamique

rach20032 · 24/10/2007, 23h55

Bonjour,

j'ai un problème, je voudrais qu'à travers les données d'une liste déroulante si on choisit une donnée de cette liste afficher les données correspondantes dans l'autre liste
exemple si on choisit France , on affiche que les villes françaises.

Sachant que les données des deux listes ne sont pas dans une table merci

Cordialement

Raideman · 25/10/2007, 00h02

Généralement tu peux soit bricoler deux formulaires .Le premier qui enverra la valeur de la premiere liste au second formulaire qui lui validera le formulaire complet. Cette technique ne nécessite que des connaissances php et mysql mais reste un peu "bricolo" à mon sens.

Ou alors une autre solution mais plus délicate à déployer au début est de gérer tes listes via ajax. Lorsque tu mets à jour la premiere liste, tu executes une requete ajax qui va calculer (dans un tableau php par exemple vu que tu n'as pas de bdd) les valeurs à afficher et les injecter dans la deuxieme liste. C'est plus sympa à mon sens parce que tu 'nas pas de réchargement de pages ainsi (de plus, ça te permet de t'initier à ajax).

gandalf76fr · 25/10/2007, 04h55

une piste ici :
http://siddh.developpez.com/articles/ajax/#LIV-A

super-java · 25/10/2007, 16h21

Voici un exemple que j'utilise et ca marche bien:
Pour la premier liste tu charge les données de la base avec ce 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
<div style="margin:5px 0 0 0;float:left;">						
					<label for='Sectactivite'>Secteur d'activité:</label> 
					<select name='Sectactivite' id ='Sectactivite' onchange='change()' style='margin:0 15px 0 20px !important;margin:0 15px 0 25px; WIDTH: 138px'">
						<option value='-1'>Aucun</option>
					<?php						
						$requete1="select * from secteur_activites";
						$resultat = mysql_query($requete1);
						while($row = mysql_fetch_row($resultat))
						{
							$NUM_SECT = $row[0];
							$LIBELLE_SECT = $row[1];
							echo "<option value='".$NUM_SECT."'>".$LIBELLE_SECT."</option>";
						}
					?>
					</select>
				</div>

et voici le code html des 2 liste :

Code :

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

1
2
3
4
5
6
7
8
9
10
<div>
					<div style="float:left;width:113px !important;width:108px;margin-top:5px;">
						<label for='act'>Activité:</label>
					</div>
					<div  id ='activite' style="margin:0px 0 0 39px !important;margin:0px 0 0 29px;">
						<select name='activite' id="act" style='width:128px;'>
							<option value='-1'>Choisir un secteur</option>
						</select>
					</div>
				</div>

et pour la 2ieme liste tu met le code php dans fichier a part et le voici que j'ai appelé Activite.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
<?php
	echo "<select style='margin-left: 13px;' name='activite'>";
	if(isset($_REQUEST["Sectactivite"]) && $_REQUEST["Sectactivite"]!=-1){
		mysql_connect("localhost","root","emploi");
		mysql_select_db("bd_dt");
		$r = "select NUM_ACT,LIBELLE_ACT from activitees where activitees.num_sect ='".$_REQUEST['Sectactivite']."'";
		$res =  mysql_query($r);
		while($row = mysql_fetch_row($res)){
			$num = $row[0];
			$lib = $row[1];
			echo "<option value='".$num."'>".$lib."</option>";
		}
		mysql_close();
	}
	else
		echo "<option value='-1'>Choisir un secteur</option>";
	echo "</select>";
 
?>

hantouva · 05/04/2011, 15h30

bonjour,
je cherche a recuperer la meme chose mais ous une base de donnes sqlserver pour ma 1ere liste qui affiche les wilaya a partir de ma bd cela fonctione le pb se pose au niveau de la seconde liste qui safiche vide voici mon 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
83
84
85
86
87
88
89
90
91
92
93
 
<?php
 
require_once('ECOFIEok\conn.php');
if(isset($_POST['cat']))
{
	session_start(); }
?>
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/javascript">
List = new Array();
function Remplir(valeur){
  var sel="";
  sel ="<select size='1' name='souscat'>";
  // Parcourir le tableau
  for (var i=0;i<List.length;i++)
   {
     // tester si la ligne du tableau (Sous-catégorie) correspond à la valeur de la catéhorie
     if (List[i][1]==valeur)
     {
       // Ajouter une rubrique sous-catégorie au variable SEL
       sel= sel + "<option value="+List[i][0]+">"+List[i][2]+"</option>";
     }
 
   }
   sel =sel + "</select>";
   // Modifier le DIV scat par la nouvelle List à partir du variable SEL
   document.getElementById('scat').innerHTML=sel;
}
 
</script>
 
</head>
 
<body>
<tr>   <td><form name="form1" method="post" action="">
      <p>&nbsp; </p>
      <p>
        <select size="1" name="cat"  dir="ltr" onChange="Remplir(cat.value)">
          <?php
// Paramètres de la Connexion à la base MYSQL
 
$i=0; // variable de test
$j=0; // variable pour garder la valeur du premier enregistrement catégorie pour l'affichage
 
 
// Séléction de tous les enregistrements de la table Catégorie
$query=odbc_exec ($sqlconnect,"SELECT * FROM wilaya order by id_wilaya");
 
while(odbc_fetch_into($query,$row))
 {
 
 // Remplir la liste déroulante des catégorie
 echo "\t\t<option value=".($row[0]).">".($row[1])."</option>";
 if ($i==0) { $j=$row[0]; $i=1; } // garder la valeur du premier enregistrement
}
 
// Séléction de tous les enregistrements de la table Sous-Catégorie
$query=odbc_exec ($sqlconnect,"SELECT * FROM commune order by id_wilaya");
 
while(odbc_fetch_into($query,$row))
 {
// $i = initialise le variable i
$i=0;
while (odbc_fetch_row($query))
{
 // Remplir le tableau (array) en javascript
 // ex : List[1]=new Array (1,1,"Sous-catégorie 1");
 // ex : List[2]=new Array (2,1,"Sous-catégorie 2");
 echo "<script>List[".$i."] = new Array(".($row[0]).",".($row[1]).",'".($row[2])."');</script>";
 $i=$i+1; // Incrémentation de $i
}
echo "<script>Remplir ($j); </script>"; // Remplir la deuxième liste de choix avec les données
 }                                       // des sous-catégories en utilisant la valeur j
?>
        </select>
        <select size="1" name="souscat" dir="ltr">
        </select>
      </p>
      <p>&nbsp; </p>
    </form> 
 
  </td>
</tr>
<tr>	
	<td width="">
			  <div id="scat" dir="ltr"> </div>		  
			  </td></tr>
</body>
</html>

ma table wilaya contient les 2 champs id_wilaya et wilayalib
la table commune contient les 3 champs: id_com,comlib,id_wilaya

voila une idee svp?? merci davance

AurelienNF · 13/08/2011, 14h07

Citation:

Envoyé par gandalf76fr

une piste ici :
http://siddh.developpez.com/articles/ajax/#LIV-A

Merci pour la piste, ça m'a bien servi !

Aurélien

24/10/2007, 23h55	#1
rach20032 Invité de passage Inscription : juin 2007 Messages : 53 Détails du profil Informations forums : Inscription : juin 2007 Messages : 53 Points : 3 Points : 3	[Conception] Liste déroulante dynamique Bonjour, j'ai un problème, je voudrais qu'à travers les données d'une liste déroulante si on choisit une donnée de cette liste afficher les données correspondantes dans l'autre liste exemple si on choisit France , on affiche que les villes françaises. Sachant que les données des deux listes ne sont pas dans une table merci Cordialement
	00

25/10/2007, 00h02	#2
Raideman Membre Expert Inscription : octobre 2002 Messages : 1 141 Détails du profil Informations personnelles : Âge : 32 Localisation : France, Rhône (Rhône Alpes) Informations forums : Inscription : octobre 2002 Messages : 1 141 Points : 1 204 Points : 1 204	Généralement tu peux soit bricoler deux formulaires .Le premier qui enverra la valeur de la premiere liste au second formulaire qui lui validera le formulaire complet. Cette technique ne nécessite que des connaissances php et mysql mais reste un peu "bricolo" à mon sens. Ou alors une autre solution mais plus délicate à déployer au début est de gérer tes listes via ajax. Lorsque tu mets à jour la premiere liste, tu executes une requete ajax qui va calculer (dans un tableau php par exemple vu que tu n'as pas de bdd) les valeurs à afficher et les injecter dans la deuxieme liste. C'est plus sympa à mon sens parce que tu 'nas pas de réchargement de pages ainsi (de plus, ça te permet de t'initier à ajax). __________________ http://www.cimbat.com Mes contributions pour developpez.com Construire un calendrier dynamique avec AJAX conseil juridique en ligne
	00

25/10/2007, 04h55	#3
gandalf76fr Membre du Club Inscription : novembre 2006 Messages : 61 Détails du profil Informations personnelles : Localisation : France, Paris (Île de France) Informations forums : Inscription : novembre 2006 Messages : 61 Points : 42 Points : 42	une piste ici : http://siddh.developpez.com/articles/ajax/#LIV-A
	00

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