Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Développement Développement Langage JavaScript Affichege et sélection de plusieurs cases à cocher

Affichege et sélection de plusieurs cases à cocher

7 réponses
Avatar
junkmels
Bonjour,

J'ai un formulaire avec plusieurs cases =E0 cocher, comme suit :

o Choix global
o Choix 1
o Choix 2
o Choix 3

Si je coche Choix global, toutes les cases se retrouvent coch=E9es. Ca
c'est OK.
Mais, j'ai besoin de l'inverse : si je coche Choix 1, 2 et 3
s=E9par=E9ment, j'aimerais alors que Choix global se retrouve coch=E9e
quand on coche la derni=E8re case.
Est-ce possible ?

Merci,
Eric
Signaler un problème avec ce contenu

7 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
Thibault TAILLANDIER
Bonjour,

J'ai un formulaire avec plusieurs cases à cocher, comme suit :

o Choix global
o Choix 1
o Choix 2
o Choix 3

Si je coche Choix global, toutes les cases se retrouvent cochées. Ca
c'est OK.
Mais, j'ai besoin de l'inverse : si je coche Choix 1, 2 et 3
séparément, j'aimerais alors que Choix global se retrouve cochée
quand on coche la dernière case.
Est-ce possible ?


Salut,
Oui. Exemple :

<script>
function getObj(name) {
var obj = document.getElementById(name);
if (obj) { return obj; }
return false;
}

function check_if_all_checked() {
if (getObj('choix1').checked && getObj('choix2').checked &&
getObj('choix3').checked) { return true; }
return false;
}

function check_status() {
if (check_if_all_checked()) {
getObj('choix1').checked = false;
getObj('choix2').checked = false;
getObj('choix3').checked = false;
getObj('choixglobal').checked = true;
return false;
}
return true;
}

function check_all() {
if (getObj('choixglobal').checked) {
getObj('choix1').checked = true;
getObj('choix2').checked = true;
getObj('choix3').checked = true;
}
else {
getObj('choix1').checked = false;
getObj('choix2').checked = false;
getObj('choix3').checked = false;
}
}
</script>

<input type="checkbox" id="choixglobal" onclick="check_all()">Choix Global
<input type="checkbox" id="choix1" onclick="check_status();">Choix 1
<input type="checkbox" id="choix2" onclick="check_status();">Choix 2
<input type="checkbox" id="choix3" onclick="check_status();">Choix 3

Ca marche bien chez moi sous Firefox.
Adapte le à ta convenance dans les cas particuliers.
Bye

Merci,
Eric



--
Thibault

Avatar
ASM
wrote:
Bonjour,

J'ai un formulaire avec plusieurs cases à cocher, comme suit :

o Choix global
o Choix 1
o Choix 2
o Choix 3

Si je coche Choix global, toutes les cases se retrouvent cochées. Ca
c'est OK.
Mais, j'ai besoin de l'inverse : si je coche Choix 1, 2 et 3
séparément, j'aimerais alors que Choix global se retrouve cochée
quand on coche la dernière case.
Est-ce possible ?

Merci,
Eric


<form>
Choix global <input type=checkbox name="Choix_global"
onclick="if(this.checked)
Choix_1.checked=Choix_2.checked=Choix_3.checked=true">
Choix 1 <input type=checkbox name="Choix_1"
onclick="if(this.checked)Choix_global.checkedúlse">
Choix 2 <input type=checkbox name="Choix_2"
onclick="if(this.checked)Choix_global.checkedúlse">
Choix 3 <input type=checkbox name="Choix_3"
onclick="if(this.checked)Choix_global.checked=true">
</form>

--
Stephane Moriaux et son [moins] vieux Mac

Avatar
Eric
Merci à vous 2, et pour les solutions proposées, et pour votre
réactivité :-)

Eric
Avatar
Eric
J'ai pris la solution de Thibault, que j'ai légèrement modifiée
(toutes les cases restent cochées lorsque j'ai sélectionné Choix 1,
2 et 3), qui fonctionne bien, mais je sêche sur la "finition"...

Quand toutes les cases sont cochées, je voudrais, lorsque je décoche
Choix 1, Choix 2 ou Choix 3, que Choix global soit décoché
automatiquement. C'est possible ?

Merci, et bon week-end,
Eric
Avatar
ASM
Eric wrote:
J'ai pris la solution de Thibault, que j'ai légèrement modifiée
(toutes les cases restent cochées lorsque j'ai sélectionné Choix 1,
2 et 3), qui fonctionne bien, mais je sêche sur la "finition"...

Quand toutes les cases sont cochées, je voudrais, lorsque je décoche
Choix 1, Choix 2 ou Choix 3, que Choix global soit décoché
automatiquement. C'est possible ?


quand on clique sur global -> si cochée ttes sont cochées
quand on clique sur 1 ou 2 tu veux que global soit touj décochée ?
quand on clique sur 3 : si c'est coché -> global cochée sinon décochée ?

Je pense que ce que j'avais donné devait le faire ?

et maintenant : décocher Global si 1 ou 2 sont décochées
-> impossible puisque 3 est touj cochée et que donc Global est cochée

il faut absolument que 3 soit décochée pour avoir Global décochée

M'enfin, tu peux touj essayer si ceci te va :

<html>
<script type="text/javascript">
function checTt(form,box,tout) {
var E = document.forms[form].elements;
var C = new Array();
var j = 0;
// recup du tableau des 'Choix_qque_chose'
for (var i=0;i<E.length;i++)
if(E[i].type=='checkbox' && E[i].name.indexOf(box)!=-1)
{ C[j] = E[i]; j++; }
// cochage des 'Choix_qque_chose'
var j = true;
for(var i=1;i<C.length;i++)
if(tout) C[i].checked=C[0].checked;
else
j = j*C[i].checked;
if(!tout) C[0].checked = j;
}
</script>

<form name="form1">
<p>Choix global <input type=checkbox name="Choix_global"
onclick="checTt('form1','Choix',true);">
<p>Choix 1 <input type=checkbox name="Choix_1"
onclick="checTt('form1','Choix');">
<p>Choix 2 <input type=checkbox name="Choix_2"
onclick="checTt('form1','Choix');">
<p>Choix 3 <input type=checkbox name="Choix_3"
onclick="checTt('form1','Choix');">
<p>Choix 4 <input type=checkbox name="Choix_4"
onclick="Choix_global.checked=this.checked;">
</form>

<form name="form2">
Choix global <input type=checkbox name="Choix_global"
onclick="
Choix_1.checked=Choix_2.checked=Choix_3.checked=this.checked">
Choix 1 <input type=checkbox name="Choix_1"
onclick="
Choix_global.checked=Choix_1.checked*Choix_2.checked*Choix_3.checked;">
Choix 2 <input type=checkbox name="Choix_2"
onclick="
Choix_global.checked=Choix_1.checked*Choix_2.checked*Choix_3.checked;">
Choix 3 <input type=checkbox name="Choix_3"
onclick="Choix_global.checked=this.checked">
</form>
</html>

--
Stephane Moriaux et son [moins] vieux Mac

Avatar
Eric
bonjour Stéphane,

j'ai tout simplement modifié la dernière ligne :

<form name="form1">
<p>Choix global <input type=checkbox name="Choix_global"
onclick="checTt('form1','Choix',true);">
<p>Choix 1 <input type=checkbox name="Choix_1"
onclick="checTt('form1','Choix');">
<p>Choix 2 <input type=checkbox name="Choix_2"
onclick="checTt('form1','Choix');">
<p>Choix 3 <input type=checkbox name="Choix_3"
onclick="checTt('form1','Choix');">
<p>Choix 4 <input type=checkbox name="Choix_4"
onclick="checTt('form1','Choix');">
</form>

ça fonctionne parfaitement, merci :-)

bonne semaine à tous,
Eric
Avatar
ASM
Eric wrote:
bonjour Stéphane,

j'ai tout simplement modifié la dernière ligne :

<p>Choix 4 <input type=checkbox name="Choix_4"
onclick="checTt('form1','Choix');">


C'est sûr que si tu abandonnes :
"la dernière box doit valider celle globale"

ça fonctionne parfaitement, merci :-)


c'est plus facile :-/


--
Stephane Moriaux et son [moins] vieux Mac