Sujet Précédent Sujet Suivant

Menus déroulants imbriqués

Fermé
Djihell - 13 nov. 2012 à 11:28
 Djihell - 13 nov. 2012 à 13:15
Bonjour,
Bonjour à tous.
J'aimerais réaliser un affichage auto dans des menus déroulants. ( 3 menus)
Je clique sur le menu1 et choisis une rubrique (choix1), dans le menu2 les sous rubriques relatives au choix 1 s'affichent, (jusque là tout va bien) et c'est après que ça se complique car je souhaiterais maintenant cliquer sur le menu2 et choisir une rubrique (choix2)pour afficher les sous-rubriques correspondantes dans le menu3.
J'ai réalisé un premier script (menu1)qui fonctionne mais je ne sais pas comment faire pour continuer l'affichage à partir du menu2.
Est-ce quelqu'un pourrait m'aider svp? je galère depuis 2 semaines
Merci d'avance
Djihell

Voici mon script:

<HEAD>

<script language=JavaScript><!-- First select from "secteur"

liste=new Array();
liste[0] = new Array("**********");
liste["Rubrique1"] = new Array("Sr01","Sr02","Sr03");
liste["Rubrique2"] = new Array("Sr001","Sr002","Sr003");
liste["Rubrique3"] = new Array("Sr0001","Sr0002","Sr0003");
liste["Rubrique4"] = new Array("Sr00001","Sr00002","Sr00003");

function changeliste1()
{
choix=document.getElementById("database1").value;
t='<select name="menu1" id="database1">';
for(i=0;i<liste[choix].length;i++)
{
t+="<option value=\""+liste[choix][i]+"\">"+liste[choix][i]+"</option>";
}
document.getElementById("menu1_div").innerHTML=t+'</select>';
}

--></script>

<script language=JavaScript><!-- Second select from "depart"

liste1=new Array();
liste1[0] = new Array("**********");
liste1["Sr01"] = new Array("Ssr11","Ssr12","Ssr13");
liste1["Sr02"] = new Array("Ssr21","Ssr22","Ssr23");
liste1["Sr03"] = new Array("Ssr31","Ssr32","Ssr33");

function changeliste2()
{
choix=document.getElementById("database2").value;
u='<select name="menu2" id="database2">';
for(i=0;i<liste1[choix].length;i++)
{
u+="<option value=\""+liste1[choix][i]+"\">"+liste1[choix][i]+"</option>";
}
document.getElementById("menu2_div").innerHTML=u+'</select>';
}

--></script>

</HEAD>



<BODY>

<form>
MENU 1 : <select id="database1" Onchange=changeliste1() name="menu1">
<option selected> </option>
<option value="Rubrique1">Première rubrique</option>
<option value="Rubrique2">Deuxième rubrique</option>
<option value="Rubrique3">Troisième rubrique</option>
<option value="Rubrique4">Quatrième rubrique</option>

</select>

MENU 2 : <A id=menu1_div><select id="database2" Onchange=changeliste2() name="menu2"></select></A>

MENU 3 : <A id=menu2_div><select name="menu3"></select></A>

</form>

</BODY>

2 réponses

Réponse 1 / 2
DarkAurora Messages postés 417 Date d'inscription lundi 26 novembre 2007 Statut Membre Dernière intervention 21 janvier 2013 27
13 nov. 2012 à 12:50
Tu applique tes fonctions du menu 1 à ton menu 2 et tes fonction du menu 2 à ton menu 3... je sais ce n'est pas une réponse au top niveau...
Maintenant pourquoi réinventer la poudre : https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxmenu/index.htm?(ui-lightness#demos/jqxmenu/defaultfunctionality.htm
0
Réponse 2 / 2
Djihell
13 nov. 2012 à 13:15
Merci pour la proposition, mais j'ai déjà essayé de répliquer la function en adaptant les ID mais vu que le menu2 est mis en valeur par le change du menu1, lorsqu'on Onchange sur le menu2 la valeur relative ne s'affiche pas dans le menu3

Je ne suis pas très performant encore dans ce language et j'ai vraiment besoin d'aide, les bouquins ne sont pas suffisant.

Merci encore pour votre aide
Djihell
0

Discussions similaires

bios insydeh20 version 3.5
maxime 2334 -
maxime 2334 -

6 réponses
Comment rétablir une barre des menus fixe?
camille987 -
_Ritchi_ -

3 réponses
affichage de la barre des menus dans Google chrome
jereyvlo -
jereyvlo -

2 réponses
Menus déroulants ne se déroulent plus
bastien14789 -
Malekal_morte- -

7 réponses
créer une arborescence avec menus déroulants
hp4461 -
JvDo -

5 réponses