En cochant une checkbox, en décocher d'autres.

Version imprimable

Bonjour tout le monde,

je cherche une solution pour faire fonctionner des checkbox comme des boutons radio.
Je m'explique:

je souhaiterais en faite que lorsque une checkbox soit coché, les autres se décoches automatiquement.

Pour cela, j'ai essayé :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 function choix_test(choix1,choix2, choix3, choix4){ if (choix1.checked == true ){ document.getElementById(choix2).checked == false; document.getElementById(choix3).checked == false; document.getElementById(choix4).checked == false; } else if (choix2.checked == true){ document.getElementById(choix1).checked == false; document.getElementById(choix3).checked == false; document.getElementById(choix4).checked == false; } else if (choix3.checked == true){ document.getElementById(choix1).checked == false; document.getElementById(choix2).checked == false; document.getElementById(choix4).checked == false; } else if (choix4.checked == true){ document.getElementById(choix1).checked == false; document.getElementById(choix3).checked == false; document.getElementById(choix2).checked == false; } }
Mais ça ne fonctionne pas...

Mon HTML :

Code:

<input id="GS430Check" name="GS" type="checkbox" value="58000" onchange="choix_test('GS300Check', 'GS430Check', 'GS450HCheck', 'GS460Check')"/>

== c'est un opérateur d'egalité, par d'attribution..

de plus le onchange n'est pas adapté, il faut passer par onmouseup avec une petite tempo

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
<script type="text/javascript">
function simradio(obj){
setTimeout( function(){
var tabChecks=document.getElementsByName('group')
var i=0;
	while(tabChecks[i++]){
		if(tabChecks[i-1]!=obj){tabChecks[i-1].checked=false;}
	}
},10)	
}
</script>
<title>Nouvelle page 1</title>
 
</head>
 
<body>
<input type="checkbox" name="group" id="chk1" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk2" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk3" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk4" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk5" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk6" onmouseup="simradio(this)" /><br/>
<input type="checkbox" name="group" id="chk7" onmouseup="simradio(this)"/><br/>
 
</body>
 
</html>

23/01/2010, 13h37
koma777

Je viens de remplacer "onclick" par "onmouseup", sans la petite tempo (d'ailleurs je ne comprend pas vraiment pourquoi utiliser une tempo)??

Tout fonctionne beaucoup mieux.
Seul hic...
J'ai une checkbox qui est coché par défaut, et qui ne se décoche pas automatiquement comme les autres, lorsqu'une autre est coché.

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
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
 
</head>
 
<body>
<script type="text/javascript">
function simradio(obj){
setTimeout( function(){
var tabChecks=document.getElementsByName('group')
var i=0;
	while(tabChecks[i++]){
		if(tabChecks[i-1]!=obj){tabChecks[i-1].checked=false;}
	}
},10)	
}
</script>
<p>
<input type="checkbox" name="group" id="chk1" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk2" checked="checked" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk3" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk4" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk5" onmouseup="simradio(this)"/><br/>
<input type="checkbox" name="group" id="chk6" onmouseup="simradio(this)" /><br/>
<input type="checkbox" name="group" id="chk7" onmouseup="simradio(this)"/><br/>
 
</body>
 
</html>

a toi de voir si tu ne veux pas le mettre la tempo ... :roll:

23/01/2010, 15h34
Bovino

Citation:

Envoyé par koma777

d'ailleurs je ne comprend pas vraiment pourquoi utiliser une tempo

Teste sur plusieurs navigateurs ;)
Je n'ai pas vérifié pour un mouseup, mais en fonction des navigateurs, la modification de la valeur intervient après la prise en compte de l'événement, donc pour vérifier la valeur souhaitée d'une checkbox ou d'un radio sur un événement de souris, il est préférable d'utiliser une temporisation.

Citation:

Envoyé par SpaceFrog

Code:

<meta name="GENERATOR" content="Microsoft FrontPage 4.0">

:cry: Non Spaffy... pas toi :(
:mouarf:
23/01/2010, 19h37
SpaceFrog

:oops:
J'avoue...
Je suis chez moi et j'ai pas mes templates de pages html dans notepad++ ...
J'ai voulu aller vite ...

J'espère que cette branche là va tenir parce que je n'en vois pas d'autres pour me raccrocher ...

:oops::aie::aie:
29/01/2010, 11h02
koma777
Pour l'instant ma fonction "décocher checkbox" fonctionne...
Mais j'ai malheureusement toujours le problème de:
Code:

1 2 <input type="checkbox" name="group" id="chk2" checked="checked" onmouseup="simradio(this)"/>
qui ne se décoche pas...

Quelqu'un aurait-il une idée?
29/01/2010, 11h33
E.Bzz

Bonjour,
tu peux essayer avec onclick.
Cf. cette Contribution

A+

J'ai trouvé la cause du problème!
Maintenant, pour la résoudre...

En faite, il ne prend pas en compte le premier "if".
Ensuite, la suite des tests fonctionnent...
Allez savoir pourquoi...?

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
 
function choix_motor(choix1,choix2, choix3, choix4){
 
        if (choix2.checked = true){
			document.getElementById(choix1).checked = false;
			document.getElementById(choix3).checked = false;
			document.getElementById(choix4).checked = false;	
	}
	else if (choix1.checked = true ){
			document.getElementById(choix2).checked = false;
			document.getElementById(choix3).checked = false;
			document.getElementById(choix4).checked = false;	
	}
	else if (choix3.checked = true){
			document.getElementById(choix1).checked = false;
			document.getElementById(choix2).checked = false;
			document.getElementById(choix4).checked = false;	
	}
	else if (choix4.checked = true){
			document.getElementById(choix1).checked = false;
			document.getElementById(choix3).checked = false;
			document.getElementById(choix2).checked = false;	
	}
}

29/01/2010, 15h05
E.Bzz
Citation:

Envoyé par koma777

En faite, il ne prend pas en compte le premier "if".
Ensuite, la suite des tests fonctionnent...
Allez savoir pourquoi...?

Ca ne serait pas à cause du i++ directement dans le while() ?
Ca donne quoi avec
Code:

1 2 3 4 5 while(tabChecks[i]){ if(tabChecks[i]!=obj) tabChecks[i].checked=false; i++; }
?

PS : sinon, les balises [ CODE] c'est avec [] et non <> ;)

A+
29/01/2010, 16h47
koma777
En faite, je n'utilise pas de while, ni de tabCheck...
D'ailleurs je comprends même pas vraiment le code. :oops:
Et obj fait référence à quoi...?
Code:

1 2 3 4 5 6 while(tabChecks[i]){ if(tabChecks[i]!=obj) tabChecks[i].checked=false; i++; }
29/01/2010, 16h55
E.Bzz

Citation:

Envoyé par koma777

D'ailleurs je comprends même pas vraiment le code. :oops:
Et obj fait référence à quoi...?

Ben peu importe, puisque c'est pas le code que tu utilises.
(une rapide relecture et hop ! c'est le paramètre de la fonction :mrgreen: )

Citation:

Envoyé par koma777

Ensuite, la suite des tests fonctionnent...

Ben non, justement, tes tests ne fonctionnent pas :aie:

Citation:

Envoyé par SpaceFrog

== c'est un opérateur d'egalité, par d'attribution..

Tu viens de faire l'erreur inverse :calim2:

A+
29/01/2010, 17h21
koma777
Citation:

Envoyé par E.Bzz

Tu viens de faire l'erreur inverse :calim2:

Comment ça? La même erreur?

Sinon, à la place de "obj", je garde mes "choix" alors?
Code:

1 2 function choix_motor(choix1,choix2, choix3, choix4)
Je voudrais bien utiliser une boucle dans ma fonction histoire d'éviter la succession de "if", "else if"...
29/01/2010, 17h28
E.Bzz
Citation:

Envoyé par koma777

Comment ça? La même erreur?

Regarde tes tests :roll:
En plus avec un booléen, il n'y pas besoin de tester une égalité

Code:

if (choix2.checked)
Citation:
Envoyé par koma777

Sinon, à la place de "obj", je garde mes "choix" alors?

Code:

1 2 function choix_motor(choix1,choix2, choix3, choix4)

Je voudrais bien utiliser une boucle dans ma fonction histoire d'éviter la succession de "if", "else if"...
Ben c'est toi qui voit.
Soit tu utilises celle de SpaceFrog (qui est largement mieux, pour être clair :mrgreen: )
Soit tu gardes la tienne qui peut très bien fonctionner si tu la corriges.
Elle est juste un peu plus ... littéraire.

Mais c'est soit l'une soit l'autre.

A+