gestion tableau multidimensionnel javascript
Bonjour,
Je cherche à personnaliser un menu déroulant en fonction d'un autre.
En fait j'ai un menu déroulant avec des categories et un deuxieme avec des sous-categories.
En gros, le premier contient les categories, et quand on change la categorie selectionnée, ca change en javascript le contenu du second menu déroulant pour n'afficher que les sous-catégories en liaison à la catégorie à laquelle elle est ratachée...
Par exemple:
Voici les catégorie:
01-Pull
02-Pantalon
Et les sous categorie:
01-pull manche longue
02-pull manche courte
01-short
02-pantacour
Donc si on selectionne pull dans le menu categorie, alors je veux que dans le menu sous-categorie il n'y ait que pull manche longe et pull manche courte...
En fait je voudrais faire un tableau associatif en php, le transformer en tableau javascript, puis sur l'attribut onChange de mon menu categorie executer une fonction qui modifie le menu sous-categorie...
Voici ce que j'ai fais:
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
|
//Création tableau en php
$requete=mysql_db_query("$base","select distinct num_categorie from sous_categorie",$db_link);
$num=mysql_num_rows($requete);
$i=0;
while($i<$num)
{
$numero_categorie=mysql_result($requete,$i,"num_categorie");
$requete2=mysql_db_query("$base","select * from sous_categorie where num_categorie=$numero_categorie order by num_sous_categorie ASC",$db_link);
$num2=mysql_num_rows($requete2);
$j=0;
while($j<$num2)
{
$tab_num_sous_categ[$numero_categorie][$j]=mysql_result($requete2,$j,"num_sous_categorie");
$tab_nom_sous_categ[$numero_categorie][$j]=mysql_result($requete2,$j,"nom_sous_categorie");
$j++;
}
$i++;
} |
Code:
1
2
3
4
5
6
7
|
//Construction des tableaux javascript à partir des tableaux php
echo "<script type='text/javascript'>";
construisTableauJS($tab_num_sous_categ, "tab_num_sous_categ_js");
construisTableauJS($tab_nom_sous_categ, "tab_nom_sous_categ_js");
echo "</script> "; |
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
|
//declaration de mes menu déroulants
<tr>
<td height="10" bgcolor="#F2F2F2" class="arialOrange02"><strong>Catégorie
produit</strong></td>
<td height="10" bgcolor="#F2F2F2">
<?
echo "<select name=\"categorie\" id=\"categorie\" onChange=\"javascript:change_sous_categ(tab_num_sous_categ_js,tab_nom_sous_categ_js);\"><option selected>Choisissez categorie...</option>";
$requete=mysql_db_query("$base","select * from categorie",$db_link);
$num=mysql_num_rows($requete);
$i=0;
while($i<$num)
{
$num_categorie=mysql_result($requete,$i,"num_categorie");
$nom_categorie=mysql_result($requete,$i,"nom_categorie");
echo "<option value=\"$num_categorie\">$num_categorie | $nom_categorie</option>";
$i++;
}
echo "</select>";
?>
</td>
</tr>
<tr>
<td height="10" bgcolor="#F2F2F2" class="arialOrange02"><strong>Sous Catégorie produit</strong></td>
<td height="10" bgcolor="#F2F2F2"><select name="souscategorie" id="souscategorie"></select></td>
</tr> |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
//Et voici pour l'instant la fonction javascript qui devrait permettre de changer le contenu du menu déroulant souscategorie:
function change_sous_categ(tab_num_sous_categ_js,tab_nom_sous_categ_js)
{
var numcategorie=document.getElementById('categorie').options[document.getElementById('categorie').selectedIndex].value;
var i;
var numero_categori;
numero_categori=numcategorie-1;
for (i=1; i<tab_num_sous_categ_js[numero_categori].length+1; i++)
{
document.getElementById('souscategorie').options[i]=new Option(tab_num_sous_categ_js[numero_categori][i-1]+' | '+tab_nom_sous_categ_js[numero_categori][i-1],tab_num_sous_categ_js[numero_categori][i-1]);
}
} |
Finalement, mon probleme, c'est que mon tableau n'est pas associatif, et que je suis obligé de décrémenter numero-catgorie pour que le premier indice du tableau soit de 0 et non 01(car les numero de categorie sont: 01,02,03...)
Alors comment faire pour créer un tableau associatif en php?
Et surtout comment faire pour acceder au données d'un tableau associatif en javascript?
