bonjour à tous !
j'ai grand besoin de votre expertise !
je vous expose le problème, je cherche à faire une série de listes qui dépendent des autres (au final, il m'en faudrait 5 minimum ...) seulement je suis bloqué à partir de 3.
J'ai déjà consulté un bon nombre de sujets sur le forum et sur la FAQ mais je ne trouve pas la solution à mon problème.
je me suis basé sur cet exemple : http://forum.phpfrance.com/faq-tutoriels/formulaires-listes-deroulantes-dynamiques-liees-t4562.html
je n'ai pas de soucis pour deux listes mais à partir de 3, mon menu "select" n'affiche rien et lorsque j'affiche la variable à l'aide d'un simple "echo" il me retourne "undefined". L'erreur se trouve donc dans la donnée de la variable qui n'est pas correcte.
Voici mon code :
test.php :
[code]<?php
echo("<?xml version=\"1.0\" encoding=\"iso-8859-1\"?>\n");
/* Variables de connexion : ajustez ces paramètres selon votre propre environnement */
$serveur = "localhost";
$admin = "***";
$mdp = "***";
$base = "***";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" xml:lang="fr" />
<title>Liste déroulantes dynamiques liées</title>
<meta name="description" content="Listes dynamiques liées: la seconde liste est modifiée via un objet XHR lors d'une sélection sur la première." />
<meta name="keywords" content="menu,déroulant,select,liées,JavaScript" />
<meta name="author" content="Cyrano" />
<meta name="generator" content="Zend Studio Environnement et WebExpert 5" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="Pragma" content="no-cache" />
<script type="text/javascript" src="./donnees_xhr.js" charset="iso_8859-1"></script>
<?php
/* Requête SQL de récupération des données de la première liste */
$sql = "SELECT * from Categorie order by cat_nom";
$connexion = pg_connect ("host=localhost user=*** password=*** dbname=***") or die('erreur de connection<br />'.pg_last_error());
$recherche = pg_query($connexion, $sql);
/* Création du tableau PHP des valeurs récupérées */
$categorie = array();
while($ligne = pg_fetch_assoc($recherche))
{
$categorie[$ligne['cat_nom']] = $ligne['cat_nom'];
}
?>
</head>
<body style="font-family: verdana, helvetica, sans-serif; font-size: 85%">
<h3>Trouver un produit</h3>
<form action="test2.php" method="post" id="produits">
<fieldset style="border: 3px double #333399">
<legend>Recherche</legend>
<select name="categorie" id="categorie" onchange="getTailles(this.value);">
<option value="vide">- - - Choisissez une catégorie - - -</option>
<?php
/* Construction de la première liste : on se sert du tableau PHP */
foreach($categorie as $nom_cat => $nom)
{
?>
<option value="<?php echo($nom_cat); ?>"><?php echo($nom); ?></option>
<?php
}
?>
</select>
<!-- ICI, le secret : on met un bloc avec un id ou va s'insérer le code de
la seconde liste déroulande -->
<span id="blocTailles" onchange="getValeurs(this.value);"></span>
<span id="blocValeurs"></span><br />
<input type="submit" name="ok" id="ok" value="Envoyer" />
</fieldset>
</form>
</html>[/code]
donnees_xhr.js :
[code]/**
* Lister les départements d'une région avec un objet
* XMLHTTPRequest.
*/
/* Création de la variable globale qui contiendra l'objet XHR */
var requete = null;
/**
* Fonction privée qui va créer un objet XHR.
* Cette fonction initialisera la valeur dans la variable globale définie
* ci-dessus.
*/
function creerRequete()
{
try
{
/* On tente de créer un objet XmlHTTPRequest */
requete = new XMLHttpRequest();
}
catch (microsoft)
{
/* Microsoft utilisant une autre technique, on essays de créer un objet ActiveX */
try
{
requete = new ActiveXObject('Msxml2.XMLHTTP');
}
catch(autremicrosoft)
{
/* La première méthode a échoué, on en teste une seconde */
try
{
requete = new ActiveXObject('Microsoft.XMLHTTP');
}
catch(echec)
{
/* À ce stade, aucune méthode ne fonctionne... mettez donc votre navigateur à jour ;) */
requete = null;
}
}
}
if(requete == null)
{
alert('Impossible de créer l\'objet requête,\nVotre navigateur ne semble pas supporter les objects XMLHttpRequest.');
}
}
/**
* Fonctions privées qui mettent à jour l'affichage de la page.
*/
function actualiserTailles()
{
var listeCat = requete.responseText;
var blocListe = document.getElementById('blocTailles');
blocListe.innerHTML = listeCat;
}
function actualiserValeurs()
{
var listeVal = requete.responseText;
var blocListe = document.getElementById('blocValeurs');
blocListe.innerHTML = listeVal;
}
/**
* Fonctions publiques appelées par la page affichée.
* Ces fonctions vont initialiser la création de l'objet XHR puis appeler
* le code serveur afin de récupérer les données à modifier dans la page.
*/
function getTailles(idc)
{
/* Si il n'y a pas de catégorie, on fait disparaître la seconde liste Tailles au cas où elle serait affichée */
if(idc == 'vide')
{
document.getElementById('blocTailles').innerHTML = '';
}
else
{
/* À cet endroit précis, on peut faire apparaître un message d'attente */
var blocListe = document.getElementById('blocTailles');
blocListe.innerHTML = "Traitement en cours, veuillez patienter...";
/* On crée l'objet XHR */
creerRequete();
/* Définition du fichier de traitement */
var url = 'tailles.php?idc='+ idc;
/* Envoi de la requête à la page de traitement */
requete.open('GET', url, true);
/* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */
requete.onreadystatechange = function()
{
/* Lorsque l'état est à 4 */
if(requete.readyState == 4)
{
/* Si on a un statut à 200 */
if(requete.status == 200)
{
/* Mise à jour de l'affichage, on appelle la fonction apropriée */
actualiserTailles();
}
}
};
requete.send(null);
}
}
function getValeurs(idt)
{
/* Si il n'y a pas de catégorie, on fait disparaître la seconde liste Tailles au cas où elle serait affichée */
if(idt == 'vide')
{
document.getElementById('blocValeurs').innerHTML = '';
}
else
{
/* À cet endroit précis, on peut faire apparaître un message d'attente */
var blocListe = document.getElementById('blocValeurs');
blocListe.innerHTML = "Traitement en cours, veuillez patienter...";
/* On crée l'objet XHR */
creerRequete();
/* Définition du fichier de traitement */
var url = 'valeurs.php?idt='+ idt;
/* Envoi de la requête à la page de traitement */
requete.open('GET', url, true);
/* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */
requete.onreadystatechange = function()
{
/* Lorsque l'état est à 4 */
if(requete.readyState == 4)
{
/* Si on a un statut à 200 */
if(requete.status == 200)
{
/* Mise à jour de l'affichage, on appelle la fonction apropriée */
actualiserValeurs();
}
}
};
requete.send(null);
}
}[/code]
taille.php :
[code]<?php
/**
* Code qui sera appelé par un objet XHR et qui
* retournera la liste déroulante des tailles
* correspondant à la catégorie sélectionnée.
*/
/* Paramètres de connexion */
/* On récupère l'identifiant de la categorie choisie. */
$idc = isset($_GET['idc']) ? $_GET['idc'] : false;
echo "$idc"
;/* Si on a une categorie, on procède à la requête */
if(false !== $idc)
{
$connexion = pg_connect ("host=localhost user=*** password=*** dbname=***") or die('erreur de connection<br/>'.pg_last_error());
$rech_taille = pg_query($connexion, $query2);
/* Création de la requête pour avoir les tailles de cette catégorie */
$query2 = "SELECT distinct taille FROM produit where categorie='$idc' order by taille";
$result2 = pg_Exec($connexion, $query2) or die("Erreur SQL !<br />$query2<br/>".pg_last_error()) ;
$num2 = pg_NumRows($result2);
$i2 = 0;
/* Un petit compteur pour les départements */
$nbr_taille = 0;
/* On crée deux tableaux pour les numéros et les noms des départements */
//$code_dept = array();
$taille = array();
/* On va mettre les numéros et noms des départements dans les deux tableaux */
while(false != ($ligne_taille = pg_fetch_assoc($result2)))
{
//$code_dept[] = $ligne_taille['id_taille'];
$taille[] = $ligne_taille['taille'];
$nbr_taille++;
}
/* Maintenant on peut construire la liste déroulante */
$liste = "";
$liste .= '<select name="taille" id="taille">'."\n";
for($d = 0; $d < $nbr_taille; $d++)
{
$liste .= ' <option value="'. $taille[$d] .'">'. htmlentities($taille[$d]) .'</option>'."\n";
}
$liste .= '</select>'."\n";
/* Un petit coup de balai */
pg_free_result($rech_taille);
/* Affichage de la liste déroulante */
echo($liste);
}
/* Sinon on retourne un message d'erreur */
else
{
echo("<p>Une erreur s'est produite. La categorie sélectionnée comporte une donnée invalide.</p>\n");
}
?>[/code]
valeurs.php :
[code]<?php
/**
* Code qui sera appelé par un objet XHR et qui
* retournera la liste déroulante des valeurs
* correspondant à la catégorie sélectionnée.
*/
/* Paramètres de connexion */
/* On récupère l'identifiant de la categorie choisie. */
$idt = isset($_GET['idt']) ? $_GET['idt'] : false;
echo "$idt";
/* Si on a une categorie, on procède à la requête */
if(false !== $idt)
{
$connexion = pg_connect ("host=localhost user=*** password=*** dbname=***") or die('erreur de connection<br/>'.pg_last_error());
$rech_valeur = pg_query($connexion, $query2);
/* Création de la requête pour avoir les valeurs de cette catégorie */
$query2 = "SELECT distinct p_valeur FROM produit where p_valeur='$idt' order by p_valeur";
$result2 = pg_Exec($connexion, $query2) or die("Erreur SQL !<br />$query2<br/>".pg_last_error()) ;
$num2 = pg_NumRows($result2);
$i2 = 0;
/* Un petit compteur pour les départements */
$nbr_valeur = 0;
/* On crée deux tableaux pour les numéros et les noms des départements */
//$code_dept = array();
$valeur = array();
/* On va mettre les numéros et noms des départements dans les deux tableaux */
while(false != ($ligne_valeur = pg_fetch_assoc($result2)))
{
//$code_dept[] = $ligne_valeur['id_valeur'];
$valeur[] = $ligne_valeur['valeur'];
$nbr_valeur++;
}
/* Maintenant on peut construire la liste déroulante */
$liste = "";
$liste .= '<select name="valeur" id="valeur">'."\n";
for($d = 0; $d < $nbr_valeur; $d++)
{
$liste .= ' <option value="'. $valeur[$d] .'">'. htmlentities($valeur[$d]) .'</option>'."\n";
}
$liste .= '</select>'."\n";
/* Un petit coup de balai */
pg_free_result($rech_valeur);
/* Affichage de la liste déroulante */
echo($liste);
}
/* Sinon on retourne un message d'erreur */
else
{
echo("<p>Une erreur s'est produite. La categorie sélectionnée comporte une donnée invalide.</p>\n");
}
?>[/code]
merci d'avance !
Nova
