Programmation ⇒ javascript facebook twitter youtube

Cocher/décocher checkbox | Cocher/décocher checkbox


Cocher/décocher une liste de cases à cocher (checkbox)

<form method="post" name="monform" id="monform" action="#">
Cocher/décocher toutes les checkbox nommé "Choix" <input onclick="CocheTout(this, 'Choix[]');" type="checkbox"><br/>
Choix 1<input name="Choix[]" value="1" type="checkbox"><br/>
Choix 2<input name="Choix[]" value="2" type="checkbox"><br/>
Choix 3<input name="Choix[]" value="3" type="checkbox"><br/>
<input name="go" value="go" type="submit">
</form>

Passons maintenant au code de la fonction Javascript :

function CocheTout(ref, name) {
	var form = ref;
 
	while (form.parentNode && form.nodeName.toLowerCase() != 'form'){ 
		form = form.parentNode; 
	}
 
	var elements = form.getElementsByTagName('input');
 
	for (var i = 0; i < elements.length; i++) {
		if (elements[i].type == 'checkbox' && elements[i].name == name) {
			elements[i].checked = ref.checked;
		}
	}
}

Et voila, c'est tout :).
Si vous souhaitez sélectionner ou dé-sélectionner un ensemble de checkbox de nom différent, il faut simplement ajouter une checkbox tout en prenant soin de modifier le nom des cases...par exemple :

Cocher/décocher toutes les checkbox nommé "Autre" <input onclick="CocheTout(this, 'Autre[]');" type="checkbox"><br/>
Autre 4<input name="Autre[]" value="4" type="checkbox"><br/>
Autre 5<input name="Autre[]" value="5" type="checkbox"><br/>
Autre 6<input name="Autre[]" value="6" type="checkbox"><br/>
Autre 7<input name="Autre[]" value="7" type="checkbox"><br/>

 

Soit :

<form method="post" name="monform" id="monform" action="#">
 
Cocher/décocher toutes les checkbox nommé "Choix" <input onclick="CocheTout(this, 'Choix[]');" type="checkbox"><br/>
Choix 1<input name="Choix[]" value="1" type="checkbox"><br/>
Choix 2<input name="Choix[]" value="2" type="checkbox"><br/>
Choix 3<input name="Choix[]" value="3" type="checkbox"><br/>
 
Cocher/décocher toutes les checkbox nommé "Autre" <input onclick="CocheTout(this, 'Autre[]');" type="checkbox"><br/>
Autre 4<input name="Autre[]" value="4" type="checkbox"><br/>
Autre 5<input name="Autre[]" value="5" type="checkbox"><br/>
Autre 6<input name="Autre[]" value="6" type="checkbox"><br/>
Autre 7<input name="Autre[]" value="7" type="checkbox"><br/>
 
<input name="go" value="go" type="submit">
</form>

Cocher/décocher toutes les checkbox nommé "Choix"
Choix 1
Choix 2
Choix 3
Cocher/décocher toutes les checkbox nommé "Autre"
Autre 4
Autre 5
Autre 6
Autre 7



>
Changer le fond
Oregionale Skin
7astuces
Sélectionnez un Fond (11)
7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces
Fond de contenu
7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces 7astuces