Petite question sur liste déroulante

Fermé
corentin.bc Messages postés 389 Date d'inscription dimanche 8 février 2015 Statut Membre Dernière intervention 4 novembre 2022 - Modifié par jordane45 le 5/06/2016 à 23:15
corentin.bc Messages postés 389 Date d'inscription dimanche 8 février 2015 Statut Membre Dernière intervention 4 novembre 2022 - 8 juin 2016 à 18:48
Salut à toutes et tous,

voilà, sur mon site j'ai ce code servant de menu :
<form method="post" action="/redirection_navigation.php">
<label for="menu_destination">Quelle page ouvrir?</label>
<select name="menu_destination" id="menu_destination">
<option value="/Accessibilite-Programmes-quoi-de-neuf.php">Quoi de neuf sur le site?</option>
<option value="/accueil.php">Accueil</option>
<option value="/AccessiKey.php">AccessiKey</option>
<option value="/bureautique.php">Bureautique</option>
<option value="/compression-decompression.php">Compression et décompression</option>
<option value="/courriers-electroniques-et-messageries.php">Courriers électroniques et messageries instantanées</option>
<option value="/audio.php">Écoute et retouche de fichiers audios et vidéos</option>
<option value="/hebergement_fichier.php">Hébergements de fichiers</option>
<option value="/internet.php">Internet</option>
<option value="/jeux.php">Jeux</option>
<option value="/vocal.php">Lecteurs d'écran</option>
<option value="/MaintenanceKey.php">MaintenanceKey</option>
<option value="/modulesNVDA.php">Modules complémentaires du lecteur d'écran NVDA</option>
<option value="/securite_et_nettoyage.php">Sécurité et nettoyage</option>
<option value="/sites_utiles.php">Sites Utiles</option>
<option value="/tutos.php">Tutoriels</option>
<option value="/utilitaires.php">Utilitaires</option>
<option value="/contact.php">Contact et réseaux sociaux</option>
<option value="/flu_du_site.Xml">Flux RSS du site</option>
<option value="/wanewsletter-3.0.0/subscribe.php">Inscription et désinscription à la newsletter du site</option>
<option value="/settings.php">Préférences et réglages</option>
<option value="téléchargement">Télécharger des logiciels installables sans parcourir les pages du site</option>
<option value="portables/téléchargement">Télécharger des logiciels portables sans parcourir les pages du site</option>
<option value="[http://www.nvda-fr.org]">Consulter le site NVDA-fr de Michel Such</option>
</select>
<br /> 
<input type="submit" value="Valider" title="aller à la page sélectionnée" />
</form>


j'aimerais faire en sorte que le bouton de validation disparaîsse, en gros quand on aliderait un item de la liste déroulante la page s'ouvrirait directement.

Comment faire ?

Merci.



EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.


Amicalement! Corentin.

5 réponses

jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
Modifié par jordane45 le 6/06/2016 à 22:52
Bonjour,

Pour se faire... tu vas devoir utiliser le javascript et l'event : onchange sur ton select.

https://www.w3schools.com/jsref/event_onchange.asp
 <select onchange="myFunction(this.value)">


https://developer.mozilla.org/fr/docs/Web/API/Document/location
 function myFunction(choix){
   document.location = choix;
}


Cordialement, 
Jordane                                                                 
0
corentin.bc Messages postés 389 Date d'inscription dimanche 8 février 2015 Statut Membre Dernière intervention 4 novembre 2022 8
Modifié par jordane45 le 6/06/2016 à 22:52
Salut,
donc, ça donne ça :
<form>
<label for="menu_destination">Quelle page ouvrir?</label>
<select name="menu_destination" id="menu_destination" onchange="myFunction(this.value)">
 myFunction(choix){
   document.location = choix;
}
<option value="/Accessibilite-Programmes-quoi-de-neuf.php">Quoi de neuf sur le site?</option>
<option value="/accueil.php">Accueil</option>
<option value="/AccessiKey.php">AccessiKey</option>
<option value="/bureautique.php">Bureautique</option>
<option value="/compression-decompression.php">Compression et décompression</option>
<option value="/courriers-electroniques-et-messageries.php">Courriers électroniques et messageries instantanées</option>
<option value="/audio.php">Écoute et retouche de fichiers audios et vidéos</option>
<option value="/hebergement_fichier.php">Hébergements de fichiers</option>
<option value="/internet.php">Internet</option>
<option value="/jeux.php">Jeux</option>
<option value="/vocal.php">Lecteurs d'écran</option>
<option value="/MaintenanceKey.php">MaintenanceKey</option>
<option value="/modulesNVDA.php">Modules complémentaires du lecteur d'écran NVDA</option>
<option value="/securite_et_nettoyage.php">Sécurité et nettoyage</option>
<option value="/sites_utiles.php">Sites Utiles</option>
<option value="/tutos.php">Tutoriels</option>
<option value="/utilitaires.php">Utilitaires</option>
<option value="/contact.php">Contact et réseaux sociaux</option>
<option value="/flu_du_site.Xml">Flux RSS du site</option>
<option value="/wanewsletter-3.0.0/subscribe.php">Inscription et désinscription à la newsletter du site</option>
<option value="/settings.php">Préférences et réglages</option>
<option value="téléchargement">Télécharger des logiciels installables sans parcourir les pages du site</option>
<option value="portables/téléchargement">Télécharger des logiciels portables sans parcourir les pages du site</option>
<option value="[http://www.nvda-fr.org]">Consulter le site NVDA-fr de Michel Such</option>
</select>
</form>


mais, ça ne fonctionne pas :(

où ai-je pu me tromper?

EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.



Amicalement! Corentin.
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
6 juin 2016 à 07:38
Tu as légèrement oublié de meytre les balises de script.... regardes donc comment écrire du Javascript dans une page....
0
corentin.bc Messages postés 389 Date d'inscription dimanche 8 février 2015 Statut Membre Dernière intervention 4 novembre 2022 8
Modifié par jordane45 le 6/06/2016 à 22:53
Donc :
<form>
<label for="menu_destination">Quelle page ouvrir?</label>
<select name="menu_destination" id="menu_destination" onchange="myFunction(this.value)">
<SCRIPT type="text/javascript">
 myFunction(choix){
   document.location = choix;
}
</SCRIPT>
<option value="/Accessibilite-Programmes-quoi-de-neuf.php">Quoi de neuf sur le site?</option>
<option value="/accueil.php">Accueil</option>
<option value="/AccessiKey.php">AccessiKey</option>
<option value="/bureautique.php">Bureautique</option>
<option value="/compression-decompression.php">Compression et décompression</option>
<option value="/courriers-electroniques-et-messageries.php">Courriers électroniques et messageries instantanées</option>
<option value="/audio.php">Écoute et retouche de fichiers audios et vidéos</option>
<option value="/hebergement_fichier.php">Hébergements de fichiers</option>
<option value="/internet.php">Internet</option>
<option value="/jeux.php">Jeux</option>
<option value="/vocal.php">Lecteurs d'écran</option>
<option value="/MaintenanceKey.php">MaintenanceKey</option>
<option value="/modulesNVDA.php">Modules complémentaires du lecteur d'écran NVDA</option>
<option value="/securite_et_nettoyage.php">Sécurité et nettoyage</option>
<option value="/sites_utiles.php">Sites Utiles</option>
<option value="/tutos.php">Tutoriels</option>
<option value="/utilitaires.php">Utilitaires</option>
<option value="/contact.php">Contact et réseaux sociaux</option>
<option value="/flu_du_site.Xml">Flux RSS du site</option>
<option value="/wanewsletter-3.0.0/subscribe.php">Inscription et désinscription à la newsletter du site</option>
<option value="/settings.php">Préférences et réglages</option>
<option value="téléchargement">Télécharger des logiciels installables sans parcourir les pages du site</option>
<option value="portables/téléchargement">Télécharger des logiciels portables sans parcourir les pages du site</option>
<option value="[http://www.nvda-fr.org]">Consulter le site NVDA-fr de Michel Such</option>
</select>
</form>



mais, ça ne fonctionne toujours pas.

EDIT : Ajout du LANGAGE dans les balises de code (la coloration syntaxique).
Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.



Que faire?
Amicalement! Corentin.
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
6 juin 2016 à 22:52
Bonsoir,

Il faudrait déjà que tu commence par apprendre les bases de la programmation html et javascript ......
Là .. tu colles des bouts de code n'importe où !

Mais bon....
essaye ça :

 <form>
   <label for="menu_destination">Quelle page ouvrir?</label>
   <select name="menu_destination" id="menu_destination" onchange="myFunction(this.value)">
      <option value="/Accessibilite-Programmes-quoi-de-neuf.php">Quoi de neuf sur le site?</option>
      <option value="/accueil.php">Accueil</option>
      <option value="/AccessiKey.php">AccessiKey</option>
      <option value="/bureautique.php">Bureautique</option>
      <option value="/compression-decompression.php">Compression et décompression</option>
      <option value="/courriers-electroniques-et-messageries.php">Courriers électroniques et messageries instantanées</option>
      <option value="/audio.php">Écoute et retouche de fichiers audios et vidéos</option>
      <option value="/hebergement_fichier.php">Hébergements de fichiers</option>
      <option value="/internet.php">Internet</option>
      <option value="/jeux.php">Jeux</option>
      <option value="/vocal.php">Lecteurs d'écran</option>
      <option value="/MaintenanceKey.php">MaintenanceKey</option>
      <option value="/modulesNVDA.php">Modules complémentaires du lecteur d'écran NVDA</option>
      <option value="/securite_et_nettoyage.php">Sécurité et nettoyage</option>
      <option value="/sites_utiles.php">Sites Utiles</option>
      <option value="/tutos.php">Tutoriels</option>
      <option value="/utilitaires.php">Utilitaires</option>
      <option value="/contact.php">Contact et réseaux sociaux</option>
      <option value="/flu_du_site.Xml">Flux RSS du site</option>
      <option value="/wanewsletter-3.0.0/subscribe.php">Inscription et désinscription à la newsletter du site</option>
      <option value="/settings.php">Préférences et réglages</option>
      <option value="téléchargement">Télécharger des logiciels installables sans parcourir les pages du site</option>
      <option value="portables/téléchargement">Télécharger des logiciels portables sans parcourir les pages du site</option>
      <option value="http://www.nvda-fr.org">Consulter le site NVDA-fr de Michel Such</option>
   </select>
</form>
 
<script type="text/javascript">
function myFunction(choix){
  document.location = choix;
}
</script> 



Si ça ne fonctionne toujours pas, je t'invite fortement à installer le plugin FIREBUG ( pour firefox), de le lancer, puis de regarder dans l'onglet CONSOLE ce qui s'affiche lorsque tu fais un choix dans ta liste déroulante.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
corentin.bc Messages postés 389 Date d'inscription dimanche 8 février 2015 Statut Membre Dernière intervention 4 novembre 2022 8
8 juin 2016 à 18:48
Slt,
alors ça fonctionne.
Mais j'ai une dernière question.
Vu que c'est un site pour DV (défficients visuels) j'ai fais des tests d'accessibilité avec le lecteur d'écran NVDA

Dans IE, Opéra, Chrome quand on se balade dans la liste déroulante par les flèches directionelles du clavier ça ouvre la page sans qu'on valide son choix par la touche entrée.
Y a-t-il un moyen d'empêcher ça ?

Merci.
0