Cliquer sur un checkbox pour d�cocher les autres

**bigs3232** · 11/07/2017, 23h50

j'ai un 3 checkbox avec la m�me classe et j'aimerais que quand l'utilisateur clique sur l'un des boxes ,les autres boxes doivent �tre d�coch�s.
le probl�me arrive quand il y a plusieurs it�rations
j'esp�re �tre assez clair et bien sur merci pour votre aide
je voudrais un code en jquery si possible

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
'<input type="checkbox" title="zz" class="box" onchange="this.form.submit()">'
'<input type="checkbox" title="zz1" class="box" onchange="this.form.submit()">'
'<input type="checkbox" title="zz2" class="box" onchange="this.form.submit()">'

**andry.aime** · 12/07/2017, 06h58

Bonjour,

Pourquoi ne pas simplement utiliser des boutons radio?

A+.

**SpaceFrog** · 12/07/2017, 09h30

j'allais le dire... c'est curieux cette tendance �vouloir aller � l'encontre de l'ergonomie standard !

Les bouton radios ont cette fonctionnalit� de base que lorsqu'ils portent le m�me name ils fonctionnent en groupe dans lequel une seul peut �tre coch� � la fois.

**bigs3232** · 12/07/2017, 09h54

merci pour vos r�ponses.effectivement c'est int�ressant.
mais intellectuellement c'est possible de faire avec la checbox?

**SpaceFrog** · 12/07/2017, 10h00

oui en affectant un script sur le onclick des checkboxes qui testera le checked et bouclera sur les autres pour les d�cocher ...

**andry.aime** · 12/07/2017, 10h18

Envoy� par SpaceFrog

j'allais le dire... c'est curieux cette tendance �vouloir aller � l'encontre de l'ergonomie standard !

Avec les mariages pour tous, qu'est ce qui t'�tonne?

**eleydet** · 12/07/2017, 14h49

Bonjour,

Ci-dessous, un exemple de solution:

Code html :

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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script>
      function decocher(a,b) {
        document.getElementById(a).checked=false;
        document.getElementById(b).checked=false;
      }
    </script>
  </head>
  <body>
    <input type='checkbox' id='id1' onclick='decocher("id2","id3")'>Cliquer<br>
    <input type='checkbox' id='id2' onclick='decocher("id1","id3")'>Cliquer<br>
    <input type='checkbox' id='id3' onclick='decocher("id1","id2")'>Cliquer
  </body>
</html>

**NoSmoking** · 12/07/2017, 19h27

Bonjour,

Ci-dessous, un exemple de solution :

Pas pour moi qui partage l'avis g�n�ral on utilise des type="radio" ou si l'apparence ne plait pas on passe par de la customisation d'�l�ments neutres, mais d�tourner des �l�ments s�mantiques ne me para�t vraiment pas opportun.

**eleydet** · 13/07/2017, 08h40

Bonjour,

NoSmoking � �crit : Pas pour moi qui partage l'avis g�n�ral on utilise des type="radio"...

Oui, bien s�r. C'est vrai en g�n�ral.

Mais il y a le cas particulier d'un ensemble de cases � cocher o� certaines combinaisons sont interdites. Par exemple, on peut cocher les trois premi�res cases mais pas la derni�re, ou bien la premi�re case et les deux derni�res mais pas la deuxi�me.

Dans ce cas particulier, il faut g�rer les cases qui seront coch�es, qu'elles soient de type "radio" ou de type "checkbox".

**SpaceFrog** · 13/07/2017, 09h04

En plus vu que tu as

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

 onchange="this.form.submit()

la page se recharge d�s qu'une box est coch�e ou d�coch�e ...
donc peu importe l'�tat des autres ...

**bigs3232** · 13/07/2017, 14h28

en fait je maitrise bien les checkbox mais les boutons radio j'ai jamais vraiment fait c'est pour ��

**bigs3232** · 13/07/2017, 15h04

je ne sais si les boutons radio marchent aussi avec onchange="this.form.submit()

**SpaceFrog** · 13/07/2017, 15h21

chiche essaye !

**bigs3232** · 13/07/2017, 15h48

ok je vais chercher un peu comment faire

**NoSmoking** · 13/07/2017, 16h37

@eleydet :

Mais il y a le cas particulier d'un ensemble de cases � cocher o� certaines combinaisons sont interdites.

cela ne change rien, dans un groupe de choix si

il peut y avoir des combinaisons on utilise des <input type="checkbox"> et on g�re les combinaisons en javascript ;
le choix doit �tre unique on utilise des <input type="radio">, il n'y a pas de gestion � faire.

@bigs3232 :
soumettre � chaque changement peut �tre un peu lourd en cas d'ind�cision du visiteur.

**bigs3232** · 13/07/2017, 18h41

j'ai fait un code comme cel�.mais j'aimerais que quand je clique sur une des radios et je soumet .cette radio doit �tre coch�
mais �� ne marche pas

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
 
if (isset($_POST[ 'radio_rep']) && $_POST[ 'radio_rep']=='aff_fich_import_ch' ) $checked=' checked="checked"';
if (isset($_POST[ 'radio_rep']) && $_POST[ 'radio_rep']=='aff_fich_dern_import' ) $checked=' checked="checked"';
echo '<form method="post">'
.'=>ned_ajout.csv   <input type="radio" name="radio_rep" value="aff_fich_import_ch"'.$checked.'>'
.'|dern import* ned_aj_img.csv  <input type="radio" name="radio_rep" value="aff_fich_dern_import"'.$checked.'>'
.'enr 2pdtmp =>'.'ned_ajout_img_h.csv<input type="radio" name="radio_rep" value="enr_fich_img"  />'
.'<input  type="submit" name="aff_valide" value="aff_valide">'			;	
echo '</form>';

**dominos** · 14/07/2017, 11h52

Bonjour,

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
function Unchecked(id) 
{
	collection = document.querySelectorAll("[id^='"+id+"']");
	co = collection.length;
	for (i = 0; i < co; i++) { 
		collection[i].checked = '';
	}
}

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
Test:
<input id="opt1" type="checkbox" onchange="Unchecked('opt');">
<input id="opt2" type="checkbox">
<input id="opt3" type="checkbox">

Bonne journ�e

**bigs3232** · 14/07/2017, 11h59

c'est gentil dominos.ton code sert � decocher plusieurs checkbox.ca ne r�ponds pas trop � mon probl�me avec mes box radio

**eleydet** · 15/07/2017, 08h37

Bonjour,

bigs3232 a �crit :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

echo '<form method="post">'

Ce code est incomplet? Il manque la page � appeler, comme ci-dessous par exemple?

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

echo '<form action="resultat.php" method="post">'

**bigs3232** · 15/07/2017, 12h26

les forms du d�but et fin sont bien pr�sent dans mon code

Cliquer sur un checkbox pour d�cocher les autres

JavaScript

Discussions similaires

Partager

Partager