Listes deroulantes lieées Javascript / HTML

[Résolu/Fermé]
Signaler
Messages postés
16
Date d'inscription
vendredi 29 avril 2011
Statut
Membre
Dernière intervention
9 mai 2013
-
Messages postés
16
Date d'inscription
vendredi 29 avril 2011
Statut
Membre
Dernière intervention
9 mai 2013
-
Bonjour,

Eh bien ça fait une journée que je bloque a chercher sur pas mal de forum je doit pas être loin de la solution... voila mon problème:
J'essaye d'écrire un programme sous forme de formulaire on choisit le type de véhicule et son type (puis son énergie etc...) mais j'ai un problème avec les listes déroulantes qui doivent être liée. Mais problème les listes :

Voiture :-Citadine
-Compact
-Berline
-4x4
et Vélo : - Normal
- Electrique

n'ont pas la même taille. Comment faire pour que la 2éme liste déroulante se mette au bon nombre de choix ?

Voici la fonction de mon code le problème c'est que le document.write() ne marche pas correctement la 2eme liste est name="type"

<script> <!-- script java -->

function choix_1(form) { <!-- Fonction pour le 1er menu deroulant liéé au second -->

var i = form.vehicule.selectedIndex; <!-- numero du choix selectioné -->
var tablength = tab.length; // longueur du tableau

if (i == 0) { <!-- si pas de choix retourne rien -->
return;
}

switch (i) { <!-- autre choix possible -->
case 1 : var tab = new Array ('Citadine','Compact','Berline','4x4'); break;
case 2 : var tab = new Array ('Electrique','Normal',''); break;
case 3 : var tab = new Array ('TER','TGV',''); break;
}

for (i=0;i<tablength;i++) {

tab[i].disabled = true; // On met les choix en disable = true

if(option) tab[i].style.display = 'none'; // Si le choix est nul on met rien

form.type.options[i+1].tab=tab[i]; <!-- associé le i-eme choix du 2eme menu a la i-eme+1 option -->
}
}

</script>
</head>



Merci d'avance pour vos réponses
Panda.

1 réponse

Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
893
voilà avec pas mal de rectifs:

<script type="text/javascript"> <!-- script javascript ne pas confondrejava et javascript ce n'est pas la même chose ! deux langages totalement différents -->

function generation_liste2(id_lire,id_ecrire) { <!-- Fonction pour le second menu deroulant liéé au choix dans le premier -->
	var liste2="";
	
	//on commence par effacer eventuellement la deuxieme liste au cas ou elle serait affichée, si on reclique sur choisissez
	document.getElementById(id_ecrire).innerHTML="";
	//on lit le choix dans liste 1
	var choix_vehicule=document.getElementById(id_lire).value; 
	// var tablength = tab.length; // longueur du tableau //la tu rentre la longueur du tableau avant même de l'avoir défini puisque c'est plus bas que tu le fait
	
	switch (choix_vehicule) { 
		//on peut tout mettre dans le switch case
		//il faut les ' de part et d'autre des 0  voiture velo etc..
		case '0' : return; break;<!-- si pas de choix retourne rien -->
		<!-- autre choix possible -->
		case 'voiture' : var tab = new Array ('Citadine','Compact','Berline','4x4'); break;
		case 'velo' : var tab = new Array ('Electrique','Normal',''); break;
		case 'train' : var tab = new Array ('TER','TGV',''); break;
	}

		//generation de la deuxieme liste
	liste2 += '<select name="type">';
	for (j=0;j<tab.length;j++) { //il te manquait le point entre tab et length, de plus tu as mis deux fois la variable i ?? c'est une possible source d'erreurs
		liste2 += '<option value="'+tab[j]+'">'+tab[j]+'</option>';
	}
	liste2 += '</select>';
	//ecriture de la deuxieme liste dans le div la page
	document.getElementById(id_ecrire).innerHTML=liste2;
}

</script>
</head>
<body>
<form name="form1" method="post" action="">
	<select name="vehicule" id="id_liste_vehicule" onchange="generation_liste2('id_liste_vehicule','id_liste2');">
		<option value="0">-- choisissez --</option>
		<option value="voiture">Voiture</option>
		<option value="velo">Vélo</option>
		<option value="train">Train</option>
	</select>
	<div id="id_liste2"><!-- la va etre ecrite la deuxieme liste --></div>

</form>

</body>
5
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 41713 internautes nous ont dit merci ce mois-ci

Messages postés
16
Date d'inscription
vendredi 29 avril 2011
Statut
Membre
Dernière intervention
9 mai 2013

J'etait donc au final asser loin du resultat ...
Merci beaucoup pour ta réponse rapide et bien expliquée.
a+