Radio Checked lorsqu'un Checkbox associé l'est aussi

**dtcSearch** · 26/02/2010, 16h41

Bonjour,

je vous explique mon cas:
j'ai 4 radios bouton (2x oui et 2x non) dans 2 tableaux distincts,

Code :

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

1
2
3
4
5
6
7
8
<table>
<tr>
<td>
	<label><input class="rd1" name="radio" type="radio" value="0" />oui</label>
	<label><input class="rd1" name="radio" type="radio" value="1" checked="checked" />non</label>
</td>
</tr>
</table>

et l'autre:

Code :

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

1
2
3
4
5
6
7
8
<table>
<tr>
<td>
	<label><input class="rd2" name="radio" type="radio" value="0" />oui</label>
	<label><input class="rd2" name="radio" type="radio" value="1" checked="checked" />non</label>
</td>
</tr>
</table>

ensuite j'ai 2 tableaux distincts contenant des checkbox.

Ces deux tableaux ont pour class rd1 pour l'un et rd2 pour l'autre.

J'aimerai que lorsqu'un checkbox d'un tableau est checked, qu'automatiquement mon radio associé soit sur oui, sinon non lors de l'affichage de la page.

Possible?

merci d'avance

**Sourrisseau** · 01/03/2010, 17h05

la question peut être compréhensible ... si le html est correct. Là tu as 2 erreurs :

- tes 4 boutons on le même attributs name. Par conséquent un seul à la fois peut être sélectionné.

- J'aimerai que lorsqu'un checkbox d'un tableau est checked, qu'automatiquement mon radio associé soit sur oui, sinon non lors de l'affichage de la page. euh .... là j'ai demandé à Champolion et il m'a répondu ' Tout les mystères ne sont pas compréhensibles ...'

Je te taquine mais c'est je ne vois vraiment pas ou tu veux en venir ....

**danielhagnoul** · 01/03/2010, 19h45

Bonsoir.

Exemple :

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
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!doctype html>
<html lang="fr">
<head>
	<meta charset="utf-8"/>
	<meta name="Author" content="Daniel Hagnoul" />
	<title>Page type</title>
	<style>		
		body {
			background-color:#dcdcdc;
			color:#000000;
			font-family:sans-serif;
			font-size:medium;
			font-style:normal;
			font-weight:normal;
			line-height:normal;
			letter-spacing:normal;
		}
		h1,h2,h3,h4,h5 {
			font-family: "Bitstream Vera Serif Bold", serif;
		}
		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img {
			margin:0px;
			padding:0px;
		}
		p {
			padding:6px;
		}
		ul,ol,dl {
			list-style:none;
			padding-left:6px;
			padding-top:6px;
		}
		li {
			padding-bottom:6px;
		}
		div#conteneur {
			width:95%;
			margin:12px auto;
			padding:6px;
			background-color:#FFFFFF;
			color:#000000;
			border:1px solid #666666;
			font-size:0.8em;
		}		
		div#affiche {
			margin:12px;
			padding:6px;
			border:1px solid #999999;
			background-color:#FFFFFF;
			color:#000000;
		}
 
		/* TEST */
	</style>
	<script charset="CP-1252" src="../lib/jquery-1.4.2.min.js"></script>
	<script>
		$(function(){
			$("#un").change(function(){
				if ($(this).attr("checked")){
					$("input[name=un]").eq(0).attr("checked","checked");
				} else {
					$("input[name=un]").eq(1).attr("checked","checked");
				}
			});
 
			$("#deux").change(function(){
				if ($(this).attr("checked")){
					$("input[name=deux]").eq(0).attr("checked","checked");
				} else {
					$("input[name=deux]").eq(1).attr("checked","checked");
				}
			});
 
			$("#un, #deux").change();
 
			$("input[name=un]").change(function(){
				if ($(this).index("input[name=un]") == 0){
					$("#un").attr("checked","checked");
				} else {
					$("#un").attr("checked","")
				}
			});
 
			$("input[name=deux]").change(function(){
				if ($(this).index("input[name=deux]") == 0){
					$("#deux").attr("checked","checked");
				} else {
					$("#deux").attr("checked","")
				}
			});
		});
	</script>
</head>
<body>
	<div id="conteneur">
		<form>
			<fieldset>
				<label>Un A : <input type="radio" name="un"/></label>
				<label>Un B : <input type="radio" name="un" checked="checked"/></label>				
			</fieldset>
			<fieldset>
				<label>Deux A : <input type="radio" name="deux"/></label>
				<label>Deux B : <input type="radio" name="deux" checked="checked"/></label>
			</fieldset>
			<fieldset>
				<label>Un : <input id="un" type="checkbox" checked="checked"/></label>
			</fieldset>
			<fieldset>
				<label>Deux : <input id="deux" type="checkbox" checked="checked"/></label>				
			</fieldset>
		</form>
	</div>
</body>
</html>

**dtcSearch** · 08/03/2010, 09h17

Merci vous deux.

Effectivement, j'avais une erreur dans mon HTML (en exemple) les deux name était identiques...

Je m'excuse pour la phrase pas clair...

Merci danielhagnoul, c'est exactement ça, je ne connais pas bien jQuery, et c'est vrai que c'est super performant lorsqu'on en maitrise les subtilités

Merci aussi pour l'exemple propre.

Radio Checked lorsqu'un Checkbox associé l'est aussi

jQuery

Discussions similaires

Partager

Partager