Variable masculin feminin dans un formulaire

**artxtra** · 03/03/2007, 10h09

Bonjour à tous,

j'avoue y connaitre pas grand chose en Javascript, et je m'arrache les cheveux quand je veux des choses simples.
Voici ma question :
j'ai un formulaire tout simple avec

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="radio" name="in_sexe" value="Homme" />

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="radio" name="in_sexe" value="Femme" />

Je voudrais que

que le label change de couleur quand value est sélectionné
qu'une variable enregistre la réponse pour pouvoir écrire au féminin la suite du texte

En effet, plus loin, j'ai un select avec Célibataire, Marié, Divorcé, etc.. et je voudrais qu'ils s'accordent en fonction de la réponse précédente.
J'ai essayé ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<label> 
<input type="radio" name="in_sexe" value="Homme" />un homme</label>
<label> 
<input type="radio" name="in_sexe" value="Femme" />
une femme</label>
<script type="text/javascript">
	var feminin = false;
	if (document.forms[0].in_sexe.value==1) 
	{var feminin = true;}
</script>

Et plus loin :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<option value="3">Marié<script type="text/javascript">if(feminin==true){document.write('e')}</script></option>

Et ça marche pas. Je me doute que la réponse doit être simple, mais pas pour moi...
Quelqu'un peut m'éclairer ? D'avance merci

**Djakisback** · 03/03/2007, 15h14

Salut,
tu peux faire ca avec des onClick :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script>
function f() {
var label = document.getElementById('lab');
var opt = document.getElementById('m');
if (document.forms[0].in_sexe.value=="Homme") {
label.className="red";
opt.innerText = "Marié";
}
else {
label.className="blue";
opt.innerText = "Mariée";
}
 
}
</script>
 
<input type="radio" name="in_sexe" value="Homme" onClick="f();" />
<input type="radio" name="in_sexe" value="Femme" onClick="f();" />
 
<select>
<option id='m'>Marié</option>
</select>

Le plus simple reste d'utiliser "Marié(e)" ^^
T'es pas obligé de passer par des getElementById() tu peux aussi accéder directement aux éléments par l'index.
Bye

**javatwister** · 04/03/2007, 11h12

autre usine à gaz, si t'as le temps de charger ça:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>...</title>
 
<style type="text/css">
 
 
</style>
 
</head>
<body>
 
<form id="f" action="">
	<p>
		<label for="hom">
			<input type="radio" name="in_sexe" id="hom" value="Homme" />
			un homme
		</label>
		<label for="fem"> 
			<input type="radio" name="in_sexe" id="fem" value="Femme" />
			une femme
		</label>
		<label for="autre"> 
			<input type="radio" name="in_sexe" id="autre" value="alien" />
			un alien
		</label>
	</p>
 
	<p>
		<select id="sel">
			<option>marié</option>
			<option>divorcé</option>
			<option>mort</option>
			<option>fiancé</option>
		</select>
	</p>
</form>
 
<script type="text/javascript">
 
var t=["marié","divorcé","mort","fiancé"];
var r=document.getElementsByName("in_sexe");
var s=document.getElementById("sel");
 
var col;
 
for(i=0; i!=r.length; i++){
	r[i].onclick=function(){
		if(col){
			col.style.color="#000000";
		}
			this.parentNode.style.color="#ff0000";
			col=this.parentNode;
 
		for(j=0; j!=s.length; j++){
			s[j].text=this.id=="fem" ? t[j]+"e" : t[j];
			s.style.backgroundColor=this.id=="fem" ? "pink" : "cyan";
		}
	}
}
 
</script>
 
 
 
</body>
</html>

**artxtra** · 05/03/2007, 15h41

Bonjour,

et merci pour vos réponses.
Pour la première, j'ai modifié pour que cela s'applique à mes identifiants et désormais, quand je clique sur homme, c'est le label de femme qui s'éclaire (?)
Je suis au boulot pour l'instant, et je n'ai pas accès à mon fichier : je collerais les modifs ce soir.
Idem pour la solution n°2.

Variable masculin feminin dans un formulaire

JavaScript

Discussions similaires

Partager

Partager