[AJAX] Filtrer un tableau en fonction d'une liste déroulante

Je te remercie quand même pour ta réponse mais c'est pas ce que je recherche.
J'ai trouvé mon bonheur auprès de jQuery et voici le code pour ceux qui en aurons besoin.

Page index :

Code:

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
94
95
96
97
98
99
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Tutoriel tri de liste sur Ao6-Labs.eu</title>
		<script src="js/jquery.min.js"></script>
		<script src="js/filtre.js"></script>
		<!-- LES ENFANTS, JULIEN EST UN DEVELOPPEUR COMPLETEMENT FOU,
		NE METTEZ JAMAIS VOS STYLES CSS DANS VOTRE PAGE HTML CHEZ VOUS -->
		<style>
                        * {
                                margin: 0;
                                padding: 0;
                                font-family: Verdana, Arial, sans-serif
                        }
                        
                        
                </style>
	</head>
	<body>
		 <div id="lipsum">
 
	<div id="page">
 
				<strong>Filtre: choisissez un département</strong><br />
 
				<select name="deptList" id="deptList">
				<option value="00">    liste complete   </option>
				<?php
                                                include 'connexion.php';
                                                $res = mysql_query("SELECT code,libelle FROM detailcorp");
                                                while($row = mysql_fetch_assoc($res))
                                                {
                                                        echo "<option value='".$row["code"]."'>".$row["code"]. $row["libelle"]."</option>";
                                                }
                                                
                                        ?>
 
				</select>
 
			</div>
		<table border="1"><tr>
 
 
          <td width=100> code</td>
 
			 <td width=100>type</td> 
 
			 <td width=400>libelle</td>
 
			 <td width=100>categorie</td>
 
			  <td width=100>modifier  </td>
 
                </tr>
	</table>
			<ul id="liste">
 
 
			<?PHP 
                                            $req1 = mysql_query("SELECT * FROM detailgrade ");
                                                $num=mysql_num_rows($req1);
                                                while($res1=mysql_fetch_array($req1))
                                                {
                                                echo" 
                                <li data-departement=$res1[1]>
                                 
                                        <table ><tr><div>";
                                        
                                   
               echo" <td width=100> $res1[0]</td>";
                        
                         echo" <td width=100>$res1[1]</td>"; 
                        
                         echo"  <td width=400>$res1[2]</td>";
                        
                         echo" <td width=100>$res1[4]</td>";
                        
                         echo"  <td width=100>modifier  </td>";
               
                
                                        echo"</div></tr></table>
                                         
                                </li>
                                 ";
                                }
                                
          
                                ?>
 
 
			<p>&nbsp;</p>
</ul>
</div>
 
 
	</body>
</html>

filtre.js :

Code:

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
$(document).ready(function(){
 
	$("#deptList").change(function(){
		var dptChoose = $(this).val(); // on récupère la value de l'option selectionnée
 
		// On traite des chaines, il est donc important de mettre deux 0 ( car l'option a comme value '00' ).
		if(dptChoose == "00")
		{
			$("ul#liste li").slideDown();
			return;
		}
 
		var i=0;
		$("ul#liste li:not(#displayIfNothingFound)").each(function(){
			if($(this).data("departement") != dptChoose)
				$(this).slideUp();
			else
			{
				i++;
				$(this).slideDown();
			}
		});
 
		// si il n'y a pas de résultat, on montre l'item fait pour, sinon si il y en a et que cet item est visible, on le cache.
		if(i == 0 && $("#displayIfNothingFound:visible").length == 0)
			$("#displayIfNothingFound").slideDown();
		else if(i > 0 && $("#displayIfNothingFound:visible").length == 1)
			$("#displayIfNothingFound").slideUp();
	});
});

et de la bibliothèque : jquery.min.js que vous pouvez télécharger.
:ccool:
Merci et mon problème est résolu.