3 listes déroulantes
3 listes déroulantes - HTML/CSS - Programmation
Marsh Posté le 23-11-2011 à 09:57:37
Rien à voir avec le topic, mais pourquoi t'as mis un sondage à ton topic 
Pour ta question : tu fais du ajax sur l'événement onchange de ta première liste déroulante. La réponse du serveur servira à alimenter la 2ème liste. Même chose sur cette 2ème liste : ajax sur onchange pour que le serveur remplisse la 3ème liste.
Sinon, ben :
- soit au chargement de la page, tu mets dans du JS les données nécessaire à remplir comme il faut tes 3 listes mais si y'a beaucoup de données, ça va rallonger le temps de chargement de ta page (si c'est une appli en local, c'est mois gênant)
- soit tu mets que les données de la première liste. sur onchange, ta page se recharge en ayant récupéré les données pour remplir la 2ème liste et ainsi de suite...
---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta
Marsh Posté le 23-11-2011 à 10:18:40
bonjour,
J'ai mis un sondage, parcqu, jen ne pouvais pas envoyer mon message.
On me posais toujours la question.
Comme, justement, je n'ai rien compris, j'ai mis n'inporte quoi pour que meon message passe
Marsh Posté le 24-11-2011 à 10:34:34
Bonjour,
Finalement avec 3 listes déroulantes: Année, Mois, Pages
Pour ceux que cela peut aider.
Voici le code qui a résolu mon problème.
[cpp]<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>buno 3 listes</title>
<meta content="Guy" name="author">
<script type="text/javascript">
<!--
function onChange()
{
var index_annee = document.getElementById('annee').selectedIndex;
var annee = document.getElementById('annee').options[index_annee].text;
var mois = document.getElementById('mois').options[document.getElementById('mois').selectedIndex].text;
var pages = document.getElementById('pages').options[document.getElementById('pages').selectedIndex].text;
var url = annee + '/' + mois + '/' + pages +'.html';
window.location=url;
}
//-->
</script>
</head>
<body style="color: white; background-color: rgb(99, 5, 39);"
alink="#dcd296" link="#dcd296" vlink="#dcd296">
<br>
<!-- liste déroulante pour les années -->
<select id="annee" name="annee" size="1">
<option value="">Choisir une Année</option>
<option value="2011">2011</option>
<option value="">2010</option>
<option value="">2009</option>
<option value="">2008</option>
</select>
<!-- liste déroulantes pour les mois -->
<select id="mois" name="mois" size="1">
<option value="">Choisir un mois</option>
<option value="">Janvier</option>
<option value="">Fevrier</option>
<option value="">Mars</option>
<option value="">Avril</option>
<option value="">Mai</option>
<option value="">Juin</option>
<option value="">Juillet</option>
<option value="">Août</option>
<option value="">Septembre</option>
<option value="">Octobre</option>
<option value="">Novembre</option>
<option value="">Décembre</option>
</select>
<!-- liste déroulante pour les pages -->
<select id="pages" name="pages" size="1" onchange="onChange();">
<option value="">Choisir une page</option>
<option value="">Couleur_du_ciel</option>
<option value="">Graphiques</option>
<option value="">Pressions</option>
<option value="">Vent</option>
<option value="">Récaps</option>
</select>
</body>
</html>
Cordialement
Message édité par PoppyGuy le 24-11-2011 à 11:28:14
Sujets relatifs:
- listes déroulantes inoperantes apres copie
- 2 listes déroulantes
- [JS] Problèmes avec listes déroulantes
- Comment protéger les listes déroulantes sur excel 2000
- Listes déroulantes et affichages
- Intitulé d'un évènement sur 2 listes déroulantes [RESOLU]
- 3 Listes déroulantes liées
- 2 listes déroulantes liés javascript+phpmysql+ajax
- 2 listes déroulantes liés javascript+phpmysql+ajax
- listes déroulantes liées ne marche pas avec firefox
Marsh Posté le 22-11-2011 à 13:46:26
Bonjour,
J'ai regardé, mais je n'ai pas trouvé de modèle qui me conviennent (ou je n'ai pas su les adapter).
Dossier 1 --> 210,2011 etc....
Sous dossier --> Les mois
Pages : Graphiques.html, vent.html, Recaps.html, Pression.html...etc
Je souhaiterais avoir 3 listes déroulantes.
Liste 1 : les années
Année 2010
Année 2011
etc....
Liste 2 : Les mois
Janvier
Février
Mars
etc....
Liste 3 : Les pages
Couleur_du_ciel
Graphiques.html
vent.html
Températures.html
Recaps.html
Pression.html
Comment puis-je faire pour, quand je clic sur un nom de la 3ème liste, je puisse avoir la page concernée ?
Voici le code de ma page :
[cpp]
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Liste déroulante ok</title>
<meta content="Guy" name="author">
<script language="javascript">
<!--
//PLF-http://www.jejavascript.net/
function process(form)
{
var choix1=form.choix1.options[form.choix1.selectedIndex].value;
var choix2=form.choix2.options[form.choix2.selectedIndex].value;
var adresse=choix1+choix2+".html";
location.href=adresse
}
//-->
</script>
</head>
<body style="color: white; background-color: rgb(99, 5, 39);"
alink="#dcd296" link="#dcd296" vlink="#dcd296">
<br>
<form action="" name="Listes">
<div align="center">
<select size="1" name="choix1">
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="Attente">Attente</option>
</select>
<select size="1" name="choix2">
<option value="/Janvier/Couleur_du_ciel">Janvier</option>
<option value="/Fevrier/Couleur_du_ciel">Février</option>
<option value="/Mars/Couleur_du_ciel">Mars</option>
<option value="2011/Mars/Pressions.html">Mars</option>
</select>
<input value="Select" onclick="process(this.form)" name="button"
type="button"> </div>
</form>
</body>
</html>
[/ccp]
Et le lien de la page :
http://meteoclopiniere.olympe-netw [...] iste3.html
Merci de votre aide, cela m'arrangerais bien.
Cordialement
PoppyGuy