[php/JS]listes déroulantes liées
bonjour à tous;
je sais que ce sujet a été traité plus d'une fois mais malgré toutes les recherches que j'ai faites je bute sur ce point depuis plus de 2 jours :oops:
j'ai fini par trouver un code que j'ai essayé d'adapter (sans faire beaucoup de modifications) mais ça ne marche pas!!!
je dois récupérer des données (régions et départements) de deux tables mysql et les afficher dans un formulaire (qui contient d'autres champs et listes déroulantes)! comme vous l'aurez certainement deviné les départements dépendent de la région sélectionnée!
le programme que j'ai ne m'affiche que les régions et apparemment un script JS bogue pour je ne sais quelle raison et comme je ne m'y connais po en JS je bute :oops:
vous trouverez ci-dessous les codes:
ce 1er code c'est celui qui bogue apparemment
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
| // JavaScript Document
/**
* Fonctions de sérialisation de tableaux PHP vers des tableaux JavaScript
* On récupère des valeurs de PHP pour les retourner en JavaScript.
*/
function PhpArray2Js(tabphp_serialise)
{
this.php = corrigerChainePHP(tabphp_serialise);
var dim = this.extraireDimTab();
this.tabjs = this.transformer(dim);
}
PhpArray2Js.prototype.retour = function()
{
// retourne le tableau JS
return this.tabjs;
}
PhpArray2Js.prototype.transformer = function(dim)
{
// méthode principale qui transforme la chaîne sérialisée en un tableau Javascript
// dim est la dimension du tableau PHP
var tab = new Array();
// extrait un groupe de dim données (indice - valeur)
for (var i=0;i<dim;i++)
{
// extrait un indice : numérique ou littéral
var indice = this.extraireIndice();
if (indice == -1)
{
return;
}
// extrait une valeur : tableau, null, booléen, numérique ou littéral
var valeur = this.extraireValeur();
if (valeur == -1)
{
tab[indice] = undefined;
}
else
{
switch (valeur[0])
{
case "N" : tab[indice] = null; break;
case "b" : tab[indice] = valeur[1] ? true : false; break;
case "i" : tab[indice] = parseInt(valeur[1]); break;
case "d" : tab[indice] = parseFloat(valeur[1]); break;
case "s" : tab[indice] = valeur[1]; break;
case "a" : tab[indice] = this.transformer(valeur[1]); break;
default : tab[indice] = undefined;
}
}
}
// en fin de groupe de données, supprime le "}" final
this.php = this.php.substring(1);
return tab;
}
PhpArray2Js.prototype.extraireDimTab = function()
{
// extrait la dimension N du tableau de "a:N:{"
var reg = this.php.match(/^a:(d+):{/);
if (reg != -1)
{
// on coupe le texte de l'entité détectée
this.php = this.php.substring(reg[0].length);
return reg[1];
}
else
{
return -1;
}
}
PhpArray2Js.prototype.extraireIndice = function()
{
// extrait l'indice d'un tableau
// cet indice peut être de la forme "i:\d+" ou "s:\d+:\"\w+\""
var retour;
var reg = this.php.match(/^((i):(d+);|(s):d+:"([^"]+)";)/);
if (reg != -1)
{
// on coupe le texte de la chaîne détectée
this.php = this.php.substring(reg[0].length);
if (reg[2] == "i") retour = reg[3];
else if (reg[4] == "s") retour = reg[5];
else retour = -1;
}
else retour = -1;
return retour;
}
PhpArray2Js.prototype.extraireValeur = function()
{
// extrait une valeur au début de this.php
// cette valeur est de type "a:d+:{" ou "N" ou "b:[01]" ou "i:d+" ou "i:[d.]+" ou "s:d+:"\w+\""
// on tente de détecter une valeur en tête de texte
var retour;
var reg = this.php.match(/^((N);|(b):([01]);|(i):(d+);|(d):([d.]+);|(s):d+:"([^"]*)";|(a):(\d+):\{)/);
if (reg != -1)
{
// on coupe le texte de la valeur détectée
this.php = this.php.substring(reg[0].length);
// retour est un tableau contenant le type et la valeur de la donnée détectée dans la chaîne
if (reg[2] == "N") retour = new Array("N", null); // valeur nulle
else if (reg[3] == "b") retour = new Array("b", reg[4]); // booléen (true/false)
else if (reg[5] == "i") retour = new Array("i", reg[6]); // entier
else if (reg[7] == "d") retour = new Array("d", reg[8]); // entier double ou flottant
else if (reg[9] == "s") retour = new Array("s", remplacerQuotes(reg[10])); // chaîne de caractères
else if (reg[11] == "a") retour = new Array("a", reg[12]); // sous-tableau
else retour = -1;
}
else retour = -1;
return retour;
}
function corrigerChainePHP(chaine)
{
// remplace les " en " uniquement autour des chaînes de caractères
chaine = chaine.replace(/:"/g, ':"');
chaine = chaine.replace(/";/g, '";');
return chaine;
}
function remplacerQuotes(chaine)
{
// remplace les " à l'intérieur des chaînes de caractères
return chaine.replace(/"/g, '\"');
}
PhpArray2Js.prototype.var_dump = function() {
// affiche le tableau
return var_dump(this.tabjs);
}
function var_dump(tab)
{
// fonction analogue à var_dump en PHP, mais plus simple
var indent = (arguments.length == 2) ? arguments[1] + "\t" : "\t";
var i = 0;
var elements = "";
for (var elt in tab)
{
elements += (i ? ",\n " : " ") + indent + "[" + elt + "]:";
switch (typeof tab[elt])
{
case "string" :
elements += "\"" + tab[elt] + "\""; break;
case "number" :
elements += tab[elt]; break;
case "object" :
if (tab[elt] == null) elements += "*null*";
else if (tab[elt]) elements += var_dump(tab[elt], indent); break;
case "undefined" :
elements += "*undefined*"; break;
default : elements += tab[elt];
}
i++;
}
return "tableau(" + i + "){\n" + elements + "\n" + (arguments[1] ? arguments[1] : "") + "}";
} |
ce 2nd code pour l'affichage des départements
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| / JavaScript Document
/* 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;
} |
et le 3ème c'est le code php qui affiche le formulaire
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
| <?php
//listes liées
/* Requête SQL de récupération des données */
$sql = "SELECT matricule AS idd, nom AS dept, matriculecom AS idr, nomcom FROM wilaya, commune WHERE matricule = matriculecom ORDER BY matriculecom;";
/* Connexion et exécution de la requête */
$connexion = mysql_connect("host", "user", "pwd");
if($connexion != false)
{
$choixbase = mysql_select_db("bd", $connexion);
$recherche = mysql_query($sql) or die('Erreur SQL !'.$sql.'<br>'.mysql_error());
/* Pour ne pas écraser mes tableaux, je crée un témoin */
$temoin_r = 0;
/* Création du tableau PHP des valeurs récupérées */
$regions = array();
/* Index du département par tableau régional */
$id = 0;
while($ligne = mysql_fetch_array($recherche))
{
$r = $ligne['idr'];
$d = $ligne['idd'];
/* Je vérifie si je suis toujours dans la même région, sinon je crée les tableaux nécessaires */
if($temoin_r != $r)
{
$regions[$r] = array();
/* J'ajoute laa région */
$regions[$r][0] = $ligne['dept'];
$regions[$r][1] = array();
$regions[$r][2] = array();
$temoin_r = $r;
$id = 0;
}
/* J'ajoute les départements */
$regions[$r][1][$id] = $d;
$regions[$r][2][$id] = $ligne['dept'];
$id++;
}
/* On sérialise le tableau obtenu pour traitement par JavaScript */
$chaine = htmlspecialchars(serialize($regions), ENT_QUOTES);
?>
<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>
<fieldset style="border: 3px double #333399">
<select name="region" id="region" onchange="changeDept(tab,this.value);">
<option value="vide">- - - Choisissez une wilaya - - -</option>
<?php
/* Construction de la première liste : on se sert du tableau PHP */
$nbr = count($regions);
foreach($regions 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 />
<?
?>
</fieldset>
<?php
//fin form
}
> |
merci à tous et désolée :oops:
