Easy-Micro

LANGAGE Script JavaScript
Menu déroulant

Script de menu déroulant

Exemple JavaScript Exemple de menu déroulant



Script en deux parties, une dans le head et l'autre dans le body du document.
Le script complet ci-dessous récupère les données du menu et les écrit dans le corps du document.
<html>
<head>
<script>
/* -- www.easy-micro.org -- */
<!--
function ecrire() {
window.document.form1.service2.value = window.document.form1.service1.value;
document.form1.service2.style.display="inline";
document.form1.service2.disabled="true";
if (document.form1.service2.value == "") {
document.form1.service2.style.display="none"; }
}
//-->
</script>
</head>
<body>
<form action="" method="post" name="form1">
<select name="service1" onchange="ecrire()" />
<option value="">Sélectionnez votre service:</option>
<option value="Achat">Achat</option>
<option value="Production">Production</option>
<option value="DRH">DRH</option>
<option value="Finance">Finance</option>
</select>
<input type="text" name="service2" style="display:none;" /></form>
</body>
</html>

Explication
Il existe, dans l'exemple ci-dessus, deux champs:
Une liste déroulante (service1) bien visible et une zone de texte (service2) rendu invisible - au départ - par l'attribut: style="display:none;". Cette liste déroulante apparaitra via le code de la fonction "ecrire()" : service2.style.display="inline";
La fonction "ecrire()" est lancée avec la syntaxe: onchange="ecrire()".
La ligne "window.document.form1.service1.value" se traduit par:
La valeur du champ service1 du formulaire "form1" de ce document de cette fenêtre.


< Page précédente SCRIPT JAVASCRIPT Page suivante >