affichage boutons radio dynamiques

Version imprimable

J'aimerais faire la chose suivante :
dans un premier select, si la personne choisit voitures cela provoque l'affichge de 3 boutons radio (renault, peugeot, simca), si elle choisit moto affichage de 2 boutons radio (yamaha, harleydavidson);
pour l'instant je ne sais faire ça qu'en passant par une variable get en php.
pouvez-vous me donner la marche à suivre pour gérer cela intégralement en javascript?
Code:

1 2 3 4 <select name="marque" onChange="window.location.replace('mapage.php?type='+this.value);"> <option value="moto">Moto </option> <option value="voiture">Voiture</option> </select>

21/11/2009, 21h33
sebhm

Bonjour,

le + simple pour commencer, 2 DIV existent (l'un avec les boutons radio 'voiture', l'autre avec les boutons radio 'moto').
par defaut, un des DIV est affiché (selon la valeur par defaut de ton select), l'autre est masqué. Par exemple avec le CSS

Code:

display : none

et lors du changement de valeur de ton select, tu affiches le DIV adéquat en javascript

Code:

document.getElementById('id_du_div_a_afficher').style.display='block';

et tu masques l'autre

Merci du tuyau Seb. J'ai essayé d'appliquer mais ça coince. Qu'est ce que j'ai raté encore ? :calim2:

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
 
<html>
	<head><title>Boutons radio dynamiques</title>
		<style type="text/css">
			<!--
 
			#un{
				display: block;
			}
			#deux{
				display: none;
			}
			-->
		</style>
		<style type="text/javascript">
			<!--
				var typevehic;
				function tourne(){
					typevehic=document.getElementById('type');
					if(typevehic.value=='moto'){
						document.getElementById('un').style.display='block';
						document.getElementById('deux').style.display='none';
					}
					if(typevehic.value=='voiture'){
						document.getElementById('un').style.display='none';
						document.getElementById('deux').style.display='block';
					}
				}
			-->
		</style>
	</head>
	<body >
		<select name="type" id="type" onChange="tourne();">
			<option value="moto" selected="selected">Moto </option>
        	<option value="voiture">Voiture</option>
		</select>
		<div id="un">
			<input type="radio" name="marques" id="1"/>Yamaha<br/>
			<input type="radio" name="marques" id="2"/>Harley Davidson<br/>
		</div>
		<div id="deux">
			<input type="radio" name="marques" id="3"/>Renault<br/>
			<input type="radio" name="marques" id="4"/>Peugeot<br/>
			<input type="radio" name="marques" id="5"/>Citron<br/>
		</div>
	</body>
</html>

22/11/2009, 09h09
Bovino

Code:

<style type="text/javascript">

Pour le JavaScript, ce sont des balises <script> ;)
22/11/2009, 13h01
Balaton

:ccool:

Merci à vous deux, les amis.