| 12
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 
 |  
<html>
 
<head>
<meta pragma="content-type" name="text/html; charset=UTF-8"/>
 
<script>
 
function Combo1(value, libelle)
{
  this.value = value;
  this.libelle = libelle;
}
 
function Combo2(depend, value, libelle)
{
  this.depend = depend;
  this.value = value;
  this.libelle = libelle;
}
 
var list1 = new Array();
list1
[list1.length] = new Combo1('V1', 'Animaux');
list1
[list1.length] = new Combo1('V2', 'Arbres');
 
var list2 = new Array();
list2
[list2.length] = new Combo2('V1', 'A1', 'Lion');
list2
[list2.length] = new Combo2('V1', 'A2', 'Cheval');
list2
[list2.length] = new Combo2('V1', 'A3', 'Tigre');
list2
[list2.length] = new Combo2('V2', 'V1', 'Chêne');
list2
[list2.length] = new Combo2('V2', 'V2', 'Sapin');
list2
[list2.length] = new Combo2('V2', 'V3', 'Hêtre');
 
function pageLoaded()
{
  var opts = document.forms[0].s1.options;
  opts[opts.length] = new Option('--- choisissez une option ---', '');
  for (var i = 0; i < list1.length; i++)
  {
    opts[opts.length] = new Option(list1[i].libelle, list1[i].value);
  }
}
 
function combo1Changed(v)
{
  var opts = document.forms[0].s2.options;
  opts.length = 0;
  for (var i = 0; i < list2.length; i++)
  {
    if (list2[i].depend == v)
    {
      opts[opts.length] = new Option(list2[i].libelle, list2[i].value);
    }
  }
}
</script>
 
</head>
 
<body onload="pageLoaded()">
 
 
<form>
Combo 1<select name="s1" onchange="combo1Changed(this.value)"></select><br>
<br>
Combo 2<select name="s2"></select><br>
</form>
 
</body>
 
</html> | 
Partager