darkoli Le Petit Dinosaure Bleu | dans la page html qui suit lorsque la selection change dans la premiere liste, le contenu de la deuxieme liste est effacé puis remplacé par un nouveau contenu en fonction de la selection de la premiere liste.
testé sur ie5.
Code :
- <html>
- <head>
- <title>Liste deroulantes</title>
- <style>
- select{font-family:courier new}
- form{margin-top:0em}
- </style>
- </head>
- <body>
- <script language="javascript">
- var na=0;
- var ta=new Array();
- var nb=0;
- var tb=new Array();
- var nbm=0;
- function ea(i,t) {
- this.id=i;
- this.texte=t;
- this.taille=0;
- }
- function eb(a,i,t) {
- this.ida=a;
- this.id=i;
- this.texte=t;
- ta[a].taille=ta[a].taille+1;
- if (ta[a].taille>nbm) nbm=ta[a].taille;
- }
- function aa(i,t) {
- ta[na]=new ea(i,t);
- na++;
- }
- function ab(a,i,t) {
- tb[nb]=new eb(a,i,t);
- nb++;
- }
- function ia() {
- var s="";
- for (var i=0;i<na;i++) {
- s=s+"<option value=\""+ta[i].id+"\">"+ta[i].texte+"</option>";
- }
- return(s);
- }
- function ib() {
- var s="";
- for (var i=0;i<nb;i++) {
- if (ta[0].id==tb[i].ida) {
- s=s+"<option value=\""+tb[i].id+"\">"+tb[i].texte+"</option>";
- }
- }
- for (var i=ta[0].taille;i<nbm;i++) {
- s=s+"<option value=\"x\"></option>";
- }
- return(s);
- }
- function ca() {
- var n=document.all.liste_a.options[document.all.liste_a.selectedIndex].value;
- var nc=0;
- for (var i=0;i<nbm;i++) {
- document.all.liste_b.options[i].value="x";
- document.all.liste_b.options[i].text="";
- }
- for (var i=0;i<nb;i++) {
- if (n==tb[i].ida) {
- document.all.liste_b.options[nc].value=tb[i].id;
- document.all.liste_b.options[nc].text=tb[i].texte;
- nc++;
- }
- }
- }
- aa(0,"ville" );
- aa(1,"region" );
- aa(2,"pays" );
- ab(0,0,"montbeliard" );
- ab(0,1,"belfort" );
- ab(0,2,"paris" );
- ab(1,0,"franche comté" );
- ab(1,1,"ile de france" );
- ab(2,0,"france" );
- ab(2,1,"italie" );
- ab(2,2,"espagne" );
- ab(2,3,"danemark" );
- </script>
- <select name="liste_a" onChange="ca()"><script language="javascript">document.write(ia())</script></select>
- <select name="liste_b" ><script language="javascript">document.write(ib())</script></select>
- </body>
- </html>
|
|
