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

**koma777** · 23/01/2010, 12h51

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 :

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
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 :

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

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

**SpaceFrog** · 23/01/2010, 13h28

== 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 :

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
<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>

**koma777** · 23/01/2010, 13h37

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é.

**SpaceFrog** · 23/01/2010, 15h02

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
<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 ...

**Bovino** · 23/01/2010, 15h34

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.

Envoyé par SpaceFrog

Code :

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

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

Non Spaffy... pas toi

**SpaceFrog** · 23/01/2010, 19h37

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 ...

**koma777** · 29/01/2010, 11h02

Pour l'instant ma fonction "décocher checkbox" fonctionne...
Mais j'ai malheureusement toujours le problème de:

Code :

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

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?

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

JavaScript

Vue hybride

Discussions similaires

Partager

Partager