décocher une checkbox en cochant une autre checkbox

**psychoBob** · 22/11/2005, 12h13

Bonjour,
Je poursuis mes pérégrinations dans l'apprentissage du javascript, et il se trouve que je viens de trouver une petite fonction très exotique dont le résultat est tout aussi ironique.

Le but initial est simple :
J'ai 5 checkbox.
Une est cochée par défaut.
Si jamais, ô grand jamais, le visiteur clique une des 4 autres, celle qui est cochée par défaut se décoche d'un air majestueux, l'air de dire "si c'est comme ça, je me décoche".

J'ai trouvé le code suivant :

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
 
<script type="text/javascript"> 
function ta() { 
 for (i=0; i<formu.length; i++) { 
 mesbox = formu.elements[i]; 
 mesbox.checked = formu.tousaucuns.checked; 
 } 
} 
</script
</head>
 
<body>
<form action="#" method="post" name="formu"> 
 <input type="checkbox" name="tousaucuns" value="tous/aucuns" onclick="ta();"> tous/aucuns<br> 
 <input type="checkbox" name="check1" value="1"> 1<br> 
 <input type="checkbox" name="check2" value="2"> 2<br> 
 <input type="checkbox" name="check3" value="1"> 3<br> 
 <input type="checkbox" name="check4" value="2"> 4<br> 
 <input type="checkbox" name="check5" value="1"> 5<br> 
 
</form>

Mais ce code coche ou décoche tout ou rien, sans aucun compromis ni discussions, ce qui est pour le moins irritant vous le reconnaîtrez.

Donc, pendant que je lis un PDF sur javascript trouvé sur développez, je me suis dit que si un magicien du web passait par là il pourrait faire apparaitre cette fonction magique qui me rendra aussi surement riche que Mr Gates.

Merci d'avance

**siddh** · 22/11/2005, 12h23

ben met des radios plutot, c est le comportement des radios de faire ca si elles ont le meme name.

des check c est fais pour offrir un choix multiple alors que les radios c est un choix unique

**psychoBob** · 22/11/2005, 12h30

Merci pour ta réponse siddh

En fait je veux des checkbox pour effectivement faire un choix multiple.

Mais comme je l'ai dit, je cherche le code pour en avoir 5 dont une cochée par défaut, et si l'on coche une (ou plus) des 4 autres, celle cochée par défaut se décoche.

C'est tout mais c'est beaucoup pour un misérable débutant.
Ca ne fait que 2 jours que je survole javascript et mon projet est pour la fin du mois (c'est essentiellement du php/mysql, je ne pensais pas avoir besoin de javascript, mais je m'apperçois que son utilisation peut parfois simplifier les choses).

**siddh** · 22/11/2005, 12h35

mwé le truc c est que un code comme ca t empechera d avoir une selection multiple puisque c est un code qui decochera les autres quand tu la coche[/code]

**Capt. Flame** · 22/11/2005, 12h38

Tien, voici un p'tit code qui pourrait t'aider...

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
<html>
<head>
    <script language="javascript">
        function ta(){
            var checkAll = document.getElementById('tousaucuns');
            var arrCheckGroup = document.getElementsByName('Group1');
            for(iLoop=0;iLoop<arrCheckGroup.length;iLoop++)
                arrCheckGroup[iLoop].checked = checkAll.checked;
        }
        function checkAll(obj){
            var checkAll = document.getElementById('tousaucuns');
 
            if(checkAll.checked == true && obj.checked==false)
                checkAll.checked = false;
            else if(obj.checked==true){
                var arrCheckGroup = document.getElementsByName('Group1');
                var allChecked = true;
 
                for(iLoop=0;iLoop<arrCheckGroup.length;iLoop++)
                    if(arrCheckGroup[iLoop].checked == false){
                        allChecked = false;
                        break;
                    }
                checkAll.checked = allChecked;
            }
        }
    </script>
</head>
<body>
    <form> 
        <input type="checkbox" name="tousaucuns" value="tous/aucuns" onclick="ta();" ID="tousaucuns"> tous/aucuns<br> 
        <input type="checkbox" name="Group1" value="1" onclick="checkAll(this);"> 1<br> 
        <input type="checkbox" name="Group1" value="2" onclick="checkAll(this);"> 2<br> 
        <input type="checkbox" name="Group1" value="1" onclick="checkAll(this);"> 3<br> 
        <input type="checkbox" name="Group1" value="2" onclick="checkAll(this);"> 4<br> 
        <input type="checkbox" name="Group1" value="1" onclick="checkAll(this);"> 5<br> 
    </form> 
 
</body>
</html>

Bonne chance

**psychoBob** · 22/11/2005, 12h39

Je n'ai pas du bien m'expliquer.

J'ai 4 catégorie pour effectuer la recherche et 5 checbox.

Si la première checkbox est cochée, cela signifie : on recherche dans les 4 catégories.

Si une ou plusieurs autres checkbox sont cochées, fatalement la première se décoche puisque l'on ne va pas chercher dans une ou plusieurs catégorie + toute à la fois, c'est absurde.

**psychoBob** · 22/11/2005, 12h42

ouah, j'étais content en voyant le code de Capitaine Flamme mais il s'avère qu'il produit la même chose que le code que j'ai placé dans le premier post...

Enfin c'est l'intention qui compte hein

**siddh** · 22/11/2005, 12h42

ok

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
<script type="text/javascript"> 
function ta() { 
  for (i=0; i<formu.length; i++) { 
 mesbox = formu.elements[i]; 
 mesbox.checked = formu.tousaucuns.checked; 
 } 
} 
function decoche(){
var lacheck = document.getElementById("defcheck");
 if(lacheck.checked)
      lacheck.checked = false; 
 
}
</script 
</head> 
 
<body> 
<form action="#" method="post" name="formu"> 
 <input type="checkbox" name="tousaucuns" id="defcheck" value="tous/aucuns" checked="checked" onclick="ta()"> tous/aucuns<br> 
 <input type="checkbox" name="check1" value="1" onclick="decoche()"> 1<br> 
 <input type="checkbox" name="check2" value="2" onclick="decoche()"> 2<br> 
 <input type="checkbox" name="check3" value="1" onclick="decoche()"> 3<br> 
 <input type="checkbox" name="check4" value="2" onclick="decoche()"> 4<br> 
 <input type="checkbox" name="check5" value="1" onclick="decoche()"> 5<br> 
 
</form>

**Capt. Flame** · 22/11/2005, 12h45

heee... C'Est quoi qui se passe quand tu places mon code?

**siddh** · 22/11/2005, 12h45

j ai edité pardon ^^

**Capt. Flame** · 22/11/2005, 12h45

Bâ... Je comprend pas ce que tu veux faire!!!

**psychoBob** · 22/11/2005, 12h46

Super, ça fonctionne merci Siddh !

Par contre en l'utilisant je me rend compte d'un problème.
Une fois que l'utilisateur à coché une ou plusieurs cases, la première se décoche, c'est bon.

Maintenant ce qui serait très bien, ce serait que s'il recoche la première, celle(s) qu'il a coché(s) se décoche(nt).

Parce que s'il redécide de faire la recherche dans toute les catégories autant cliquer la checkbox initiale plutot que de décocher celles déjà cochée...

**siddh** · 22/11/2005, 12h48

regarde, j ai edité le code, je sais pas quelle version tu as

**Capt. Flame** · 22/11/2005, 12h48

Ok, tu veux garder la sélection de l'utilisateur... Mais, c'est un commentaire, tu trouves pas illogique d'avoir un check "Tous" qui est coché et de ne pas avoir toutes les checks associés cochés?

C'est vraiment mon opinion mais il me semble que ça fait pas très intuitif...

**siddh** · 22/11/2005, 12h50

Envoyé par Capt. Flame

document.getElementsByName

c'est pas standard ca non ?

**siddh** · 22/11/2005, 12h51

oué c est vrai que j ai mis coché par defaut sans cocher les autres

faut enlever le checked="checked" ou le rajouter sur les autres

**Capt. Flame** · 22/11/2005, 12h52

Oui...
http://www.quirksmode.org/dom/w3c_core.html

**Capt. Flame** · 22/11/2005, 12h52

Et malgré ce qu'ils disent, c'est fonctionnel sous IE

**psychoBob** · 22/11/2005, 12h59

Non je trouve que c'est bien, simplement si on recoche le checked "toutes les catégories" il faut que les checked cochées se décochent.

C'est soit la case "toute".
Soit une ou plusieurs cases précises.

Imaginez qu'il y a 50 checbox qu'est ce qui se passe ?
j'ai 50 cases cochées par défaut (douteux déjà), je décoche la première pour les décocher toutes, puis je recoche les bonnes : 1 clics plus les clics pour choisir.
Je veux maintenant rechercher dans toutes les catégories, et je reclique sur la checkbox "toutes les catégories" et hop elles se recochent toute.

Je trouve plus simple d'avoir une case qui dit "toutes les catégories".
Si on veut une ou plusieurs catégories ont clique la ou les checbox (ce qui décoche la case "toutes les catégories") : on économise un clique pour tout décocher.

Si ensuite on veut rechercher dans toutes les catégories on clique la case "toutes les catégories" ce qui décochent celle(s) cochée(s).
Il est inutile qu'elles soient toutes cochées pour dire que l'on va rechercher dans toutes les catégories, puisque de fait c'est déjà toutes les catégories qui sont sélectionnées en une seule case.

**siddh** · 22/11/2005, 13h01

bha apres c est ton appli tu la gères comme tu veux

penses a mettre

si ca te va

décocher une checkbox en cochant une autre checkbox

JavaScript

Discussions similaires

Partager

Partager