liste déroulante + Tableau

Version imprimable

22/03/2013, 17h42
AbouZaid

liste déroulante + Tableau

salut à tous,

Voilà, j'ai une liste déroulante avec des noms provenant de la base.

Je voudrais afficher un tableau sur cette page qui sera actualisé une fois qu'on a choisi un autre nom dans la liste déroulante.

J'ai déjà créé le tableau mais il n'est pas dynamique.

des idées pour le faire??

Merciii à tous.:ccool::ccool:
22/03/2013, 19h19
rawsrc

Salut,

un petit tuto sur mon blog dvp avec les listes liées ici.
Bonne lecture

merci, je vais m'y mettre... :)

EDIT :

Salut, je suis entrain d'adapter ton exemple sur mon problème et je n'ai vraiment pas tout compris, du coup je débogue le code.

Je suis juste sur la partie d'appel ajax et je voudrais savoir si elle fonctionne ou pas :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function filterLists() {
         // ici on récupère les valeurs sélectionnées pour chaque liste avec les sélecteurs de jQuery
         var nom    = $('#Noms option:selected').val();
		window.alert(nom);
         // 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: 'filterLists.php',   // script à exécuter sur le serveur
            data: 'nom='+nom,   // 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;
			   window.alert(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('noms').text()).length)    $('#noms').html(code);
            }
         });
      }

Comment savoir si la fonction ramène qlq chose?

Merci pour ton aide.

23/03/2013, 23h15
AbouZaid

En fait ce que je ne comprend pas c'est ou est ce qu'on dit au tableau de se regénérer??

pour ma part j'ai un tableau avec des id et les noms correspondants :
ID Nom
10 nom1
20 nom2
30 nom3
, je voudrais faire un simple test : Une fois je choisi l'id(10 par exemple) sur la liste de valeur, la tableau m'affiche :
ID Nom
10 nom1
23/03/2013, 23h38
rawsrc

Salut,

Il faudrait que tu postes le code de filterLists.php

voici le contenu demandé :

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
<?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;
 
 
/**
 * 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>  
 * </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']) && (ctype_digit("{$_POST['nom']}"))) {
   $nom = $_POST['nom'];
   $where[] = 'j25_users.id = ' . intval($nom);
}
 
 
### FILTRAGE DES DONNÉES DES LISTES (SSI RIEN N'A DÉJÀ ÉTÉ SÉLECTIONNÉ)  
$where = ( ! empty($where)) ? 'WHERE ' . implode(' AND ', $where) : NULL;
 
// ICI MODIFIEZ LE PARAMETRAGE
// Connexion à la base de données
$db=& JFactory::getDBO();
$my =& JFactory::getuser();
 
 
 
 
// 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 = <<<SQL
j25_users.id = sun_user_cotisation.id_user
and sun_user_cotisation.id_cotisation = sun_cotisations.id
$where
SQL;
 
 
/**
 * Crée le code HTML pour les liste relatives aux villes et matières
 * @param mixed $sql
 * @return string
 */
function filtrageNoms($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) ? 't_session' : $fromAndWhere;
 
 
 
// si le nom 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) ? 'j25_users' : $fromAndWhere;
   $sql = "SELECT DISTINCT j25_users.id FROM $from;";
   $xml->addChild('noms', filtrageNoms($sql));
   $data = array();
}
 
 
// données de la table
$sql = <<<SQL
select u.ID, 
NAME, 
DESCRIPTION, 
EXERCICE, 
MONTANT, 
MONTANT_REGLE
FROM  
   $fromAndWhere;
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[] = <<<HTML
<tr>
   <td>{$row['ID']}</td>
   <td class="alignc">{$row['NAME']}</td>
   <td>{$row['DESCRIPTION']}</td>
   <td class="alignr">{$row['EXERCICE']}</td>
    <td class="alignr">{$row['MONTANT']}</td>
	<td class="alignr">{$row['MONTANT_REGLE']}</td>
</tr>
HTML;
}
 
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();
 
?>

Salut,

j'ai pas compris le comment tu as fait pour adapter mon code à ton problème.
Je l'ai repris (en jouant aux devinettes)

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
<?php
 
// Ce script est appelé à chaque sélection d'un élément d'une liste
 
// suivi du critère
$where = array();
$data  = array();
 
/**
 * 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>
 *    <table></table>
 * </xml>
 *
 * @var SimpleXMLElement
 */
$xml = simplexml_load_string('<?xml version="1.0" encoding="utf-8"?><xml></xml>');
 
// nom
if (isset($_POST['nom']) && (ctype_digit("{$_POST['nom']}")) && $_POST['nom'])
{
   $where[] = 'j25_users.id = '.(int)$_POST['nom'];
}
 
$sql_where = ( ! empty($where)) ? 'WHERE ' . implode(' AND ', $where) : null;
 
// ICI MODIFIEZ LE PARAMETRAGE
// Connexion à la base de données
$db = JFactory::getDBO();
$my = JFactory::getuser();  // à quoi ça sert ?
 
// données de la table
$sql =
<<<SQL
SELECT
    u.id,
    name,
    description,
    exercice,
    montant,
    montant_regle
FROM
    j25_users u
        INNER JOIN sun_user_cotisation uc ON u.id             = uc.id_user
        INNER JOIN sun_cotisations     c  ON uc.id_cotisation = c.id
{$sql_where}
SQL;
 
// ici tu dois utiliser ton accès à la DB pour exécuter la requête
// quelque chose comme ça
$qry = $db::query($sql);
 
// mise en forme des données
// ici on reconstruit les données de la table
// fonction d'échappement des données pour la sécurité de l'affichage
$hes = function($p) { return htmlentities($p); };
 
// ici tu dois utiliser la fonction de ta classe pour extraire un jeu de données du résultat
// c'est pas forcément mysql_fetch_assoc
while($row = mysql_fetch_assoc($qry))
{
   $data[] =
<<<HTML
<tr>
    <td>{$hes($row['id'])}</td>
    <td>{$hes($row['name'])}</td>
    <td>{$hes($row['description'])}</td>
    <td>{$hes($row['exercice'])}</td>
    <td>{$hes($row['montant'])}</td>
    <td>{$hes($row['montant_regle'])}</td>
</tr>
HTML;
}
 
if (empty($data)) { // pas de données correspondant au filtre
   $data[] = '<tr><td colspan="6">Pas de données</td></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();
 
?>

Dans ta problématique, tu n'as qu'à mettre à jour la table des données correspondant au nom sélectionné et tu n'as aucun besoin de mettre à jour la liste des noms.

Je te remercie, en fait après une journée de perseverence, j'ai pu adapter ton code à mon problème.

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
<?php
 
 include("includes/utf8.php");
 
define('_JEXEC', 1 );
define('JPATH_BASE', dirname(__FILE__));
define( 'DS','/' );
 
require_once ( JPATH_BASE.DS.'includes'.DS.'defines.php' );
require_once ( JPATH_BASE.DS.'includes'.DS.'framework.php' );
require(JPATH_BASE.DS.'libraries/joomla/factory.php');
 
$mainframe =& JFactory::getApplication('site');
$mainframe->initialise(); 
 
 
// 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;
 
 
/**
 * 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>  
 * </xml>  
 *
 * @var SimpleXMLElement
 */
$xml = simplexml_load_string('<?xml version="1.0" encoding="utf-8"?><xml></xml>');
 
// Connexion à la base de données
$db=& JFactory::getDBO();
$my =& JFactory::getuser();
 
 
/**
 * Crée le code HTML pour les liste relatives aux villes et matières
 * @param mixed $sql
 * @return string
 */
function filtrageNoms($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);
}
 
// Récupération de l'ID 
if (isset($_POST['id']) && (ctype_digit("{$_POST['id']}"))) {
   $nom = $_POST['id'];
} 
 
 
// données de la table
$query = "select u.ID, NAME, DESCRIPTION, EXERCICE, MONTANT, MONTANT_REGLE from
`sun_user_cotisation` uc
, sun_cotisations c
, j25_users u
WHERE u.id = uc.id_user
and uc.id_cotisation = c.id
and u.id = $nom";
 
$data = array();
//$qry = mysql_query($sql);
$db->setQuery($query);
// récupération des résultats dans un tableau
$rows = $db->loadObjectList();
// mise en forme des données
// ici on reconstruit les données de la table
//while($rows = $db->loadObjectList())
/*   <td class="alignc">{$row['NAME']}</td>
   <td>{$row['DESCRIPTION']}</td>
   <td class="alignr">{$row['EXERCICE']}</td>
    <td class="alignr">{$row['MONTANT']}</td>
	<td class="alignr">{$row['MONTANT_REGLE']}</td>
	*/
foreach ($rows as $row) {
if ($row->MONTANT == $row->MONTANT_REGLE ){
   $data[] = <<<HTML
<tr BGCOLOR="#C1E19F">
   <td>$row->ID</td>
   <td>$row->NAME</td>
   <td>$row->DESCRIPTION</td>
   <td align="center">$row->EXERCICE</td>
   <td align="right">$row->MONTANT</td>
   <td align="right">$row->MONTANT_REGLE</td>
   <td>Réglée</td>
</tr>
HTML;
}
else{
   $data[] = <<<HTML
<tr BGCOLOR="#FFBDDF">
   <td>$row->ID</td>
   <td>$row->NAME</td>
   <td>$row->DESCRIPTION</td>
   <td align="center">$row->EXERCICE</td>
   <td align="right">$row->MONTANT</td>
   <td align="right">$row->MONTANT_REGLE</td>
   <td>Non Réglée</td>
</tr>
HTML;
}
}
 
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();
 
?>

Merci infiniment. Ca marche Impec!! :) :ccool::ccool: