menus déroulants liés

Version imprimable

Bonjour à tous,
voilà j'aimerais lier 2 menus déroulant : j'ai récupéré un code, mais cela ne fonctionne pas. quand je choisis un pays je veux que les villes correspondantes au pays selectionné s'affiche dans le second menu déroulant. mais après un long deboguage et des cheveux arrachés, il n'y a qu'une seule instruction qui coince :

Code:

formulaire.choixVille.options.length = lesVilles.length;

lesVilles.length est bien trouvé, mais c'est formulaire.choixVille.options.length qui casse tout, et franchement je comprend pas pourquoi...

Voici le code complet :

Code:

1
2
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
 
<script language="JavaScript">
function verif()
  {
  if (document.layers)
    {
    formulaire = document.forms.monFormulaire;
    }
  else
    {
    formulaire = document.monFormulaire;
    }
  }
 
function verifChoixPays()
  {
  verif();
  if (formulaire.choixPays.value == "0")
    {
    alert('Vous devez tout d\'abord choisir un pays!');
    formulaire.choixPays.focus();
    }
  }
 
var villes = new Array();
villes[0] = new Array();
villes[1] = new Array("Paris", "Lyon", "Marseille")
villes[2] = new Array("Londres", "Manchester", "Liverpool")
villes[3] = new Array("Berlin", "Stutgart", "Munich")
 
function remplirVilles(num)
  {
  verif();
  var lesVilles = villes[num];
 
  if (num>0)
    {
    formulaire.choixVille.options.length = lesVilles.length;
    for (i=0; i<lesVilles.length; i++)
      {
      formulaire.choixVille.options[i].value = lesVilles[i];
      formulaire.choixVille.options[i].text = lesVilles[i];
      }
    document.monFormulaire.choixVille.options.selectedIndex = 0;
    }
  else
    {
    formulaire.choixVille.options.length = 1;
    formulaire.choixVille.options[0].value = 0;
    formulaire.choixVille.options[0].text = "-- choisissez une ville";
    }
  }
</script>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<form name="monFormulaire">
<select name="choixPays" onChange="remplirVilles(this.options[this.selectedIndex].value);">
<option value="0" selected>-- choisissez un pays</option>
<option value="1">France</option>
<option value="2">Royaume-Uni</option>
<option value="3">Allemagne</option>
</select>
<br>
<br>
<select name="choixVille" onFocus="verifChoixPays();">
<option value="0" selected>-- choisissez une ville</option>
</select>
</form>

merci d'avance de votre aide
bonne journée!

20/07/2007, 19h38
SpaceFrog

as tu regardé le post-it au dessus ?
24/07/2007, 15h18
syella34

le post-it?....
24/07/2007, 16h16
guy777

Comprend pas ton problème, j'ai fait un copier/coller de ton code et il marche très bien. Je l'ai testé sur IE7 et Firefox... Comment se manifeste l'erreur ? En faisant quelle(s) manipulation(s) ?
24/07/2007, 17h04
syella34

ça fait rien c'est bien ça le problème lol pas de message d'erreur, juste que lorsque je choisis un pays je n'ai pas les villes correspondantes qui apparaissent... si le code marche ailleurs (et evidemment pas chez moi!) je pense que je vais prendre le problème autrement du coup, merci quand meme :-)
25/07/2007, 11h50
syella34

re bonjour :-)
du coup j'ai un autre problème qui se pose... j'ai mes 2 menus deroulants qui sont sensés être liés... un menu service et un menu personne. quand je selectionne un service, je veux que dans la liste des personnes il y ait la liste des personnes appartenant au service selectionné (donc que ça aille péché dans la bdd), et inversement, quand je selectionne une personne je veux la liste des services auxquelles elle appartient, en allant interroger la bdd. mais pour interroger la bdd, je dois recharger la page non? donc du coup, mon javascript tombe à l'eau???
25/07/2007, 13h49
guy777

Dans un souci d'efficacité et de simplicité, il vaut mieux (je crois) éviter les appels répétés à la BD. Le mieux c'est de récupérer tout ce dont tu as besoin pour ton script, de construire la page ensuite (HTML + JavaScript)...

Pour répondre à ta dernière question, si tu interroge la base par l'intermédiaire de JavaScript, tu n'est pas obligé de réactualiser la page.