2 pièce(s) jointe(s)
aide sur le code source de liste déroulante dynamique
Bonjour à tous ,
j'ai un soucis à filtrer les données de la table ,
j'ai utilisé ajax pour le transfert de données entre fichier php.
j'ai quatre liste déroulante, chacun contient les données d'une colonne , et au démarrage de la page , tous les données s'affiche , comme suit :
Pièce jointe 110192
j'ai deux fichiers php :
select.php
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
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
| <head>
<script type="application/javascript" charset="utf-8" src="jquery-1.6.3.min.js"></script>
<script type="application/javascript">
function filterLists() {
// ici on récupère les valeurs sélectionnées pour chaque liste avec les sélecteurs de jQuery
var nom = $('#nom option:selected').val();
var prenom = $('#prenom option:selected').val();
var sexe = $('#sexe option:selected').val();
var ville = $('#ville option:selected').val();
// on fait notre appel ajax paramétré (pas besoin de s'occuper de l'implémentation du XMLHttpRequest, jQuery le fait pour toi)
$.ajax({
type: 'POST', // méthode de transmission des données
url: 'selectListe.php', // script à exécuter sur le serveur
data: 'nom='+nom+'&prenom='+prenom+'&sexe='+sexe+'&ville='+ville, // données à passer au script via le tableau $_POST
dataType: 'xml', // type des données attendues en retour : ici xml
cache: false,
success: function(response) { // traitement du résultat (= données reçues du serveur) une fois l'appel ajax réussi
var code;
// vu que la réponse est au format xml, on demande à jquery de trouver des noeuds spécifiques
// et si ces noeuds contiennent des données alors on remplace les données des listes liées par celles renvoyées par le serveur
// en clair : on remplace si nécessaire l'ensemble des lignes <option value=""></option> pour chaque liste qui n'a pas encore de sélection
if ((code = $(response).find('nom').text()).length) $('#nom').html(code);
}
});
}
</script>
<style type="text/css">
td {
border : 1px dashed #4c4;
align : center;
width : 120px;
}
th {
align : center;
width: 120px;
}
</style>
</head>
<body>
<form id='frmRecherche'>
<?php
include("connexion_mysql.php");
//-----------------------------------------------------------------------------------
echo'<table border=1 bordercolor=pink >';
echo'<tr><th>Nom :</th><td><select id="nom" onchange="filterLists();">';
echo '<option value="">---</option>';
$sql = "select distinct(nom) from information " ;
$result = mysql_query($sql, $cnx) or die( mysql_error() ) ;
$total = mysql_num_rows($result);
while($row = mysql_fetch_array($result)) {
echo "<option value=".$row['nom'].">".ucfirst($row['nom'])."</option>";
}
echo '</select>';
//------------------------------------------------------------------------------------
echo'<th>Prénom :</th><td><select id="prenom" onchange="filterLists();">';
echo '<option value="">---</option>';
$sql = "select prenom from information " ;
$result = mysql_query($sql, $cnx) or die( mysql_error() ) ;
$total = mysql_num_rows($result);
while($row = mysql_fetch_array($result)) {
echo "<option value=".$row['prenom'].">".ucfirst($row['prenom'])."</option>";
}
echo '</select>';
//------------------------------------------------------------------------------------
echo'<th>Ville :</th><td><select id="ville" onchange="filterLists();">';
echo '<option value="">---</option>';
$sql = "select distinct(ville) from information " ;
$result = mysql_query($sql, $cnx) or die( mysql_error() ) ;
$total = mysql_num_rows($result);
while($row = mysql_fetch_array($result)) {
echo "<option value=".$row['ville'].">".ucfirst($row['ville'])."</option>";
}
echo '</select>';
//------------------------------------------------------------------------------------
echo'<th>Sexe :</th><td><select id="sexe" onchange="filterLists();">';
echo '<option value="">---</option>';
$sql = "select distinct(sexe) from information " ;
$result = mysql_query($sql, $cnx) or die( mysql_error() ) ;
$total = mysql_num_rows($result);
while($row = mysql_fetch_array($result)) {
echo "<option value=".$row['sexe'].">".ucfirst($row['sexe'])."</option>";
}
echo '</select></table></form>';
//------------------------------------------------------------------------------------
$sql = "select nom,prenom,email,age,tel,datenaissance,sexe,ville from information";
$qry = mysql_query($sql);
while($row = mysql_fetch_assoc($qry)) {
$data[] = $row;
}
?>
<br><br>
<table>
<thead>
<tr>
<th>Nom</th>
<th>Prenom</th>
<th>Email</th>
<th>Age</th>
<th>Tel</th>
<th>Date Naissance</th>
<th>Sexe</th>
<th>Ville</th>
</tr>
</thead>
<tbody>
<?php foreach($data as $row): ?>
<tr>
<td><?php echo $row['nom']; ?></td>
<td><?php echo $row['prenom']; ?></td>
<td><?php echo $row['email']; ?></td>
<td><?php echo $row['age']; ?></td>
<td><?php echo $row['tel']; ?></td>
<td><?php echo $row['datenaissance']; ?></td>
<td><?php echo $row['sexe']; ?></td>
<td><?php echo $row['ville']; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</body>
</html> |
et le fichier selectListes.php :
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
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
| <?php
// Ce script est appelé à chaque sélection d'un élément d'une liste
// suivi du critère
$where = array();
$data = array();
// données sélectionnées => filtres
$nom = NULL;
$prenom = NULL;
$ville = NULL;
$sexe = NULL;
/**
* CE SCRIPT ANALYSE LES SELECTIONS ET RENVOIE DES DONNEES AU FORMAT XML
* La structure correspond à ce que jQuery attend pour mettre à jour la page
* <?xml version="1.0" encoding="utf-8"?>
* <xml>
* <nom></nom>
* <prenom></prenom>
* <ville></ville>
* <sexe></sexe>
* <table></table>
* </xml>
*
* @var SimpleXMLElement
*/
$xml = simplexml_load_string('<?xml version="1.0" encoding="utf-8"?><xml></xml>');
// on parcourt le tableau $_POST et on vérifie quelles sont les listes qui ont une sélection
// nom
if (isset($_POST['nom'])) {
$nom = $_POST['nom'];
// echo $nom;
$where[] = 'nom = \'' . $nom.'\'';
}
// prenom
if (isset($_POST['prenom']) ) {
$prenom = $_POST['prenom'];
// echo $prenom;
$where[] = 'prenom = \'' .$prenom.'\'';
}
// villes
if (isset($_POST['ville']) ) {
$ville = $_POST['ville'];
// echo $ville;
$where[] = 'ville = \'' . $ville.'\'';
}
// sexe
if (isset($_POST['sexe'])) {
$sexe = $_POST['sexe'];
// echo $sexe;
$where[] = 'sexe = \'' .$sexe.'\'';
}
### FILTRAGE DES DONNÉES DES LISTES (SSI RIEN N'A DÉJÀ ÉTÉ SÉLECTIONNÉ)
$where = ( ! empty($where)) ? 'WHERE ' . implode(' OR ', $where) : NULL;
// ICI MODIFIEZ LE PARAMETRAGE
// Connexion à la base de données
$server = 'localhost';
$user = 'root';
$pwd = 'root';
$dbName = 'test';
$cnx = mysql_connect($server, $user, $pwd);
$db = mysql_select_db($dbName);
// on définit le code SQL commun à toutes les requêtes
// voir la chaine SQL d'extraction des données de la table (plus bas)
$fromAndWhere = " information $where";
/**
* Crée le code HTML pour les liste relatives aux dates : Jours Mois Années
* @param mixed $sql
* @return string
*/
function filtrageDates($sql) {
$data = array();
$qry = mysql_query($sql);
$data[] = '<option value=""></option>'; // ligne vide
while($row = mysql_fetch_row($qry)) {
$data[] = '<option value="' . $row[0] . '">' . $row[0] . '</option>';
}
return implode("\n", $data);
}
/**
* Crée le code HTML pour les liste relatives aux villes et matières
* @param mixed $sql
* @return string
*/
function filtrageVillesMatieres($sql) {
$data = array();
$qry = mysql_query($sql);
$data[] = '<option value=""></option>'; // ligne vide
while($row = mysql_fetch_row($qry)) {
$data[] = '<option value="' . $row[0] . '">' . $row[1] . '</option>';
}
return implode("\n", $data);
}
// si aucun where -> on repart sur l'extraction de toutes les données possibles (pareil qu'au 1er appel index.php)
$fromDates = (NULL === $where) ? 'information' : $fromAndWhere;
/*
// si le jour n'a pas déjà été sélectionné -> filtrage de la liste
// if (NULL === $jour) {
// $sql = "SELECT DISTINCT DAY(t_session.date_) FROM $fromDates ORDER BY DAY(t_session.date_);";
// $xml->addChild('jours', filtrageDates($sql));
// }
// si le mois n'a pas déjà été sélectionné -> filtrage de la liste
// if (NULL === $mois) {
// $sql = "SELECT DISTINCT MONTH(t_session.date_) FROM $fromDates ORDER BY MONTH(t_session.date_);";
// $xml->addChild('mois', filtrageDates($sql));
// }
// si l'année n'a pas déjà été sélectionnée -> filtrage de la liste
// if (NULL === $annee) {
// $sql = "SELECT DISTINCT YEAR(t_session.date_) FROM $fromDates ORDER BY YEAR(t_session.date_);";
// $xml->addChild('annees', filtrageDates($sql));
// $data = array();
// }
*/
// si la ville n'a pas déjà été sélectionnée -> filtrage de la liste
if (NULL === $ville) {
// si aucun where -> on repart sur l'extraction de toutes les données possibles (pareil qu'au 1er appel index.php)
$from = (NULL === $where) ? 'information' : $fromAndWhere;
$sql = "SELECT DISTINCT ville FROM $from ;";
$xml->addChild('ville', filtrageVillesMatieres($sql));
$data = array();
}
// si la ville n'a pas déjà été sélectionnée -> filtrage de la liste
if (NULL === $prenom) {
// si aucun where -> on repart sur l'extraction de toutes les données possibles (pareil qu'au 1er appel index.php)
$from = (NULL === $where) ? 'information' : $fromAndWhere;
$sql = "SELECT DISTINCT prenom FROM $from ;";
$xml->addChild('prenom', filtrageVillesMatieres($sql));
$data = array();
}
// si la ville n'a pas déjà été sélectionnée -> filtrage de la liste
if (NULL === $sexe) {
// si aucun where -> on repart sur l'extraction de toutes les données possibles (pareil qu'au 1er appel index.php)
$from = (NULL === $where) ? 'information' : $fromAndWhere;
$sql = "SELECT DISTINCT sexe FROM $from ;";
$xml->addChild('sexe', filtrageVillesMatieres($sql));
$data = array();
}
// si la matière n'a pas déjà été sélectionnée -> filtrage de la liste
if (NULL === $nom) {
// si aucun where -> on repart sur l'extraction de toutes les données possibles (pareil qu'au 1er appel index.php)
$from = (NULL === $where) ? 'information' : $fromAndWhere;
$sql = "SELECT DISTINCT nom FROM $from ;";
$xml->addChild('nom', filtrageVillesMatieres($sql));
$data = array();
}
// données de la table
$sql ="
SELECT
nom,prenom,email,age,tel,datenaissance,sexe,ville
FROM
$fromAndWhere";
// echo $sql;
$data = array();
$qry = mysql_query($sql);
// mise en forme des données
// ici on reconstruit les données de la table
while($row = mysql_fetch_assoc($qry)) {
$data[] =
"<tr>
<td>".$row['nom']."</td>
<td>".$row['prenom']."</td>
<td>".$row['email']."</td>
<td>".$row['age']."</td>
<td>".$row['tel']."</td>
<td>".$row['datenaissance']."</td>
<td>".$row['sexe']."</td>
<td>".$row['ville']."</td>
</tr>" ;
}
if (empty($data)) { // pas de données correspondant au filtre
$data[] = '<tr></tr>';
}
$xml->addChild('table', implode("\n", $data)); # noeud attendu par jQuery dans filterLists()
// Envoi du header et des données
header('content-type: text/xml');
echo $xml->asXML();
?> |
le probléme c'est que lorsque je choisis un item dans le select , les données se filtres et je les vois quand je fais ctrl+shift+j. par exemple si je choisis dans le menu sexe :femme, il y a un fichier xml qui contient les données de la table seulement des femmes. mais le tableau html reste le méme , normalement devra filtrer les données !
Pièce jointe 110196
c quoi le probléme à vos avis !
bon j'ai suivi l'exemple de rawsrc;
