Listes déroulantes [Résolu]

Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
- - Dernière réponse : Guy72
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
- 28 nov. 2011 à 08:50
Bonjour,
Sur mon site, je cherche à faire une liste déroulante, j'ai bien un modèle qui me plairais, mais ça ne fonctionne pas.
Voilà ce que cela donne.

2.html

Ma liste 1 comprendrait pour l'instant:
Année 2010
Année 2011

Ma liste 2 comprendrait les mois
Janvier
Février
etc......

Je souhaiterais:
1) Clic sur la flèche de la list 1
2) Choisir l'année

3) Clic sur la flèche de la liste 2
4) Choisir le mois, qui me dirige vers la page html


Par exemple : Si je clic sur Janvier, cela doit me dirriger vers "Ciel.html"

Je ne sais pas comment faire pour lier la page.
"Ciel.html"

Merci de votre aide
Cordialement Guy
Afficher la suite 

20/35 réponses

Meilleure réponse
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
3
Merci
"Par autre chose", je voulais savoir si ce que j'ai modifié est le plus simple, si il n'y a mieux à faire.

Météoclopinière

Merci de ton aide, sans toi, je n'y serais jamais arrivé


Cordialement Guy

Dire « Merci » 3

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 210 internautes nous ont dit merci ce mois-ci

Commenter la réponse de Guy72
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
3
Merci
Bonjour,
Eh oui, c'est bien ça

window.open('http://www.tonsite/com/'+url);


Ça fonctionne

Merci encore de ton aide et de ta patience
Cordialement Guy

Dire « Merci » 3

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 210 internautes nous ont dit merci ce mois-ci

Commenter la réponse de Guy72
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
3
Merci
Bonjour,
J'ai ajouter un eutre message pour un menu dynamique.
J'ai juste un problème de décalage des sous/menu part à port au menu

Si tu pouvais voir..............

Merci de ton aide

Cordialement Guy

Dire « Merci » 3

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 210 internautes nous ont dit merci ce mois-ci

Commenter la réponse de Guy72
Messages postés
56
Date d'inscription
mercredi 14 septembre 2011
Statut
Membre
Dernière intervention
7 octobre 2012
0
Merci
Salut Guy,
Je pense qu'il faut que tu mette ta page en PHP et que tu te créé une table SQL.
Commenter la réponse de stephelle
Messages postés
41
Date d'inscription
vendredi 30 octobre 2009
Statut
Membre
Dernière intervention
13 décembre 2012
0
Merci
Bonjour,

Regarde pour un redirect en javascript et l'évènement onChange de javascript sur google tu devrais trouver ce que tu cherche.
Commenter la réponse de galled
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
Hello,
Je plussoie galled:
<html>
<head>
<script type="text/javascript">
<!--
function onChange()
{
  window.location="http://www.google.fr";
}
//-->
</script>
</head>

<select id="select" name="select" size="1" onchange="onChange();">
    <option value="default">Veuillez sélectionner une option</option>
<option value="opt1">option1</option>
<option value="opt1">option2</option>
<option value="opt1">option3</option>
</select>

</html>



@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Bonsoir,
Oui d'accord, mais il n'y a qu'une liste.
Finalement, je cherche une 3ème liste


Cordialement Guy
Commenter la réponse de Guy72
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
Suit le même principe: une callback "onchange" dans laquelle tu fais ce que bon te semble


@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Bonjour,
Je vis voir ça, mais je n'y crois pas, car :
une callback "onchange", je ne sais pas ce que ça veut dire
Cordialement Guy
Commenter la réponse de Guy72
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
Tu as un exemple avec 2 listes.
Je t'ai fait un exemple de redirection de page après sélection dans une liste.
Il reste à afficher la bonne page suivant le mois choisi...
Je te laisse essayer de mettre ça ensemble maintenant*
Néanmoins, si tu n'y arrives toujours pas, repasses par ici et je te filerais un coup de main.

* rien de méchant, c'est juste à titre didactique car, pour moi, "on ne donne pas à un eskimau un poisson, on lui apprend à pêcher"

@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
Re,
Voici un exemple un peu plus complet.
<html>
<head>
<script type="text/javascript">
<!--
function onChange()
{
  // récupération de l'année en 2 étapes:
  // - on parcours la hiérarchie d'éléments pour connaître l'index de l'élément sélectionné dans la liste 'annee'
  // - on récupère le texte associée à cet index
  var index_annee = document.getElementById('annee').selectedIndex;
  var annee = document.getElementById('annee').options[index_annee].text;
  
  // on fait la même chose pour les mois
  var mois = document.getElementById('mois').options[document.getElementById('mois').selectedIndex].text;
  
  // on affiche le résultat
  alert('vous avez sélectionné ' + mois + ' ' + annee);
  
  // pour une redirection suivant les sélections, c'est à voir
  // admettons que le lien à afficher dépend de l'année et du mois
  // il suffit de concaténer les résultat pour avoir, par exemple http://www.monsite.com/2008/octobre.html
  //var url = 'http://www.monsite.com/' + annee + '/' + mois + '.html";
  //window.location=url;
}
//-->
</script>
</head>

<!-- liste déroulante pour les années -->
<select id="annee" name="annee" size="1">
    <option value="">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" onchange="onChange();">
    <option value="">Janvier</option>
<option value="">Février</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>

</html>



@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
Re,
Est-ce que cela correspond à tes attentes?


@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Bonsoir,
Ça devrait ma convenir, mais il faut que je regarde comment aller à mes pages.

J'ai l'mpression, qu'il va me faloir un 3ème liste pour les pages.

Il y a 6 pages par mois.

Cordialement Guy
Commenter la réponse de Guy72
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Désolé, mais je ne vois rien.


Cordialement Guy
Commenter la réponse de Guy72
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
Comment ça "tu ne vois rien?" mon code t' affiché normalement une popup avec
Tes sélections, non?
@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Bonjour,
Excuse de ne pas avoir répondu hier soir, mais je suis sorti.
Je me suis mal exprimé.
Si..si, je vois bien la petite fenêtre.
Mais je voulais dire que j'essayé de voir mes pages, mais je n'y arrive pas.


Cordialement Guy
Commenter la réponse de Guy72
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Comme, je ne sais pas comment éditer mon ancien message,j'en remets un autre avec le code avec lequel j'ai essayé.

<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>buno</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 url = annee + '/' + mois + '.html";
window.location=url;
}
//-->
</script>
</head>



<!-- liste déroulante pour les années -->
<select id="annee" name="annee" size="1">
<option value="">Choisir une Année</option>
<option value="">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" onchange="onChange();">
<option value="">Choisir un mois</option>
<option value="2011/Janvier/Vent">Janvier</option>
<option value="">Février</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>

</html>


Cordialement Guy
Commenter la réponse de Guy72
Messages postés
14655
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
12 novembre 2019
90
0
Merci
var url = annee + '/' + mois + '.html";

Attention, faute de frappe: tu as une double quote à la fin au lieu d'une simple quote.
De plus, d'après ton code, tes pages ont pour adresse:
http://www.monsite.com/2011/janvier.html
Est-ce le cas? Sinon, il va falloir retravailler l'url.

@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...
Commenter la réponse de BunoCS
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Bonjour,
Ça va déjà beaucoup mieux, impossible pour moi, impossible de savoir que la "double quote" était pas bonne, comme je n'avais rien changé dans ton code (à part enlever ou mettre les //).

Ça ne passe pas par une Url.
Janvier.html, n'est pas la page.

1)Choisir une année
2) choisir un mois
3) Choisir une page

Regarde le code que j'essaye de modifier avec les pages :

<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>



<!-- 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" onchange="onChange();">
<option value="">Choisir un mois</option>
<option value="">Janvier</option>
<option value="">Février</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">Soleil et Pluie</option>
<option value="Graphiques">Graphiques</option>
<option value="Pressions">Pressions</option>
<option value="Vent">Vitesse du Vent</option>
<option value="Recaps">Statistiques</option>
</select>

</html>


En attendant, merci de ton aide
Cordialement



Cordialement Guy
Commenter la réponse de Guy72
Messages postés
499
Date d'inscription
dimanche 18 novembre 2007
Statut
Membre
Dernière intervention
26 septembre 2019
0
Merci
Ça fonctionne !!!!


J'ai changé quelques trucs comme :
1) Ajouté ça:
var pages = document.getElementById('pages').options[document.getElementById('pages').selectedIndex].text;


2) Modifié ça :
var url = annee + '/' + mois + '/' + pages +'.html';

<select id="mois" name="mois" size="1">


3) Et ajouté ça :
<!-- 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>


Peut être autre chose ?

[http:// Site]

Cordialement Guy
Commenter la réponse de Guy72