$clients[$r][0] = $ligne['client'];<?php
echo("<?xml version=\"1.0\" encoding=\"iso-8859-1\"?>\n");
?>
<!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=iso-8859-1" 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 instantanément 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="./arrayPHP2JS.js" charset="iso_8859-1"></script>
<script type="text/javascript" src="./changeDept.js" charset="iso_8859-1"></script>
<?php
$sql1 = "SELECT client.nom AS client, designation, client.id_client from master, client WHERE client.nom=master.client ORDER BY client, designation;";
$connexion = pg_connect("user=adminpg password=alice dbname=intranet");
if($connexion != false)
{
$recherche = pg_query($connexion, $sql1);
$i = "";
$clients = array();
echo $recherche;
while($ligne = pg_fetch_assoc($recherche))
{
$e= $ligne['client'];
$r= $ligne['id_client'];
if($i != $e)
{
$clients[$r] = array();
$clients[$r][0] = $ligne['client'];
$clients[$r][1] = array();
$i = $e;
$id = 0;
}
$clients[$r][1][$id] = $ligne['designation'];
$id++;
}
/* On sérialise le tableau obtenu pour traitement par JavaScript */
$chaine = htmlspecialchars(serialize($clients), ENT_QUOTES);
?>
<pre>
<?php
var_dump($clients);
var_dump($chaine);
?>
</pre>
<script type="text/javascript">
/* <![CDATA[ */
<!--
/*
* Ici, on transmets la chaîne sérialisée à JavaScript
* pour la transformer en tableau indexé JavaScript
*/
var tableau = new PhpArray2Js('<?php echo $chaine; ?>');
var tab = tableau.retour();
// -->
/* ]]> */
</script>
</head>
<body style="font-family: verdana, helvetica, sans-serif; font-size: 85%">
<h3>Version Utilisant JavaScript</h3>
<p>Vous constaterez que le délai de latence entre la sélection et la mise à jour est quasiment inexistant.</p>
<?php
if(isset($_POST['ok']) && isset($_POST['departement']) && $_POST['departement'] != "")
{
$region_selectionnee = $_POST['region'];
$dept_selectionne = $_POST['departement'];
?>
<p>Vous avez sélectionné le département <?php echo($dept_selectionne); ?> dans la région <?php echo($region_stionnee); ?></p>
<?php
}
?>
<form action="<?php echo($_SERVER['PHP_SELF']); ?>" method="post" id="chgdept">
<fieldset style="border: 3px double #333399">
<legend>Sélectionnez une région</legend>
<select name="region" id="region" onchange="changeDept(tab,this.value);">
<option value="vide">- - - Choisissez une région - - -</option>
<?php
/* Construction de la première liste : on se sert du tableau PHP */
$nbr = count($clients);
foreach($clients as $nr => $nom)
{
?>
<option value="<?php echo($nr); ?>"><?php echo($nom[0]); ?></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="blocDepartements"></span><br />
<input type="submit" name="ok" id="ok" value="Envoyer" />
</fieldset>
</form>
<?php
}
else
{
/* Si vous arrivez ici, vous avez un gros problème avec la connexion au serveur de base de données */
?>
</head>
<body>
<p>La connexion au serveur de base de données a échoué. Aucun élément ne peut être affiché.</p>
<?php
}
?>
<p><a href="./index.php" title="Aller vers la version 100% PHP">Aller vers la version 100% PHP</a></p>
</body>
</html>
Code : Tout sélectionner
array(2) {
[2]=>
array(2) {
[0]=>
string(4) "CGEA"
[1]=>
array(2) {
[0]=>
string(16) "MASTER 1 de CGEA"
[1]=>
string(16) "MASTER 2 de CGEA"
}
}
[1]=>
array(2) {
[0]=>
string(4) "NERV"
[1]=>
array(3) {
[0]=>
string(16) "MASTER 1 de NERV"
[1]=>
string(16) "MASTER 2 de NERV"
[2]=>
string(16) "MASTER 3 de NERV"
}
}
}
/* On crée la fonction qui va construire la seconde liste déroulante */
function changeDept(tab,idr)
{
if(idr != "vide")
{
/* On compte les départements de cette région */
var nbd = tab[idr][1].length;
var form_d = '<select name="departement" id="departement">';
for(var j = 0; j < nbd; j++)
{
form_d += ' <option value="'+ tab[idr][1][j] +'">'+ tab[idr][2][j] +" ("+ tab[idr][1][j] +')<\/option>';
}
form_d += '<\/select>';
}
else
{
form_d = "";
}
document.getElementById("blocDepartements").innerHTML = form_d;
}
/* On crée la fonction qui va construire la seconde liste déroulante */
function changeDept(tab,idr)
{
alert(tab ='\n'+idr);
if(idr != "vide")
{
/* On compte les départements de cette région */
var nbd = tab[idr][1].length;
var form_d = '<select name="departement" id="departement">';
for(var j = 0; j < nbd; j++)
{
form_d += ' <option value="'+ tab[idr][1][j] +'">'+ tab[idr][2][j] +" ("+ tab[idr][1][j] +')<\/option>';
}
form_d += '<\/select>';
}
else
{
form_d = "";
}
document.getElementById("blocDepartements").innerHTML = form_d;
}
form_d += ' <option value="'+ tab[idr][1][j] +'">'+ tab[idr][2][j] +" ("+ tab[idr][1][j] +')<\/option>'; /* On crée la fonction qui va construire la seconde liste déroulante */
function changeDept(tab,idr)
{
alert(tab ='\n'+idr);
if(idr != "vide")
{
/* On compte les départements de cette région */
var nbd = tab[idr][1].length;
var form_d = '<select name="departement" id="departement">';
var form_d1 = '<select name="departement1" id="departement1">';
for(var j = 0; j < nbd; j++)
{
form_d += ' <option value="'+ tab[idr][1][j] +'">'+ tab[idr][1][j] +')<\/option>';
form_d1 += ' <option value="'+ tab[idr][1][j] +'">'+ tab[idr][1][j] +')<\/option>';
}
form_d += '<\/select>';
form_d1 += '<\/select>';
}
else
{
form_d = "";
}
document.getElementById("blocDepartements").innerHTML = form_d;
document.getElementById("blocDepartements1").innerHTML = form_d1;
}