Menu déroulant
Script de menu déroulant
<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>
<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.