begin process at 2010 02 10 15:30:44
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Formulaire

 > CONTROLER LE NOMBRE DE CHECKBOX CLIQUEES

CONTROLER LE NOMBRE DE CHECKBOX CLIQUEES


 Information sur la source

Note :
5 / 10 - par 2 personnes
5,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Formulaire Classé sous :checkbox, contrôle, tableau, array Niveau :Débutant Date de création :18/05/2004 Date de mise à jour :29/11/2005 15:23:46 Vu :18 116
Auteur : Samiby

Ecrire un message privé
Commentaire sur cette source (12)
Ajouter un commentaire et/ou une note

 Description

Pour expliquer ce code, je vais prendre un exemple:
Il y a des checkbox dans un formulaire, et vous ne voulez pas que l'utilisteur coche plus de X checkbox.
Cette source permet de controler qu'il n'en clique pas plus, et de transférer ce qu'il a cliqué à un script php.

Source

  • <script language="javascript">
  • <!--
  • //nb max de choix possible
  • var nbre_max=3;
  • var nbre=0;
  • var url = new Array(nbre_max+1);
  • function checkbox(num){
  • if((document.form.list_check[num].checked)==true){
  • nbre++;
  • } else {
  • nbre--;
  • }
  • if(nbre > nbre_max){
  • alert('Pas plus de 3 ateliers !');
  • document.form.list_check[num].checked=false;
  • nbre--;
  • }
  • }
  • function verif(){
  • if(nbre==0) {
  • alert('Choisis un checkbox !');
  • document.form.list_check[0].focus();
  • } else {
  • for(y=0; y<document.form.list_check.length; y++){
  • if(document.form.list_check[y].checked == true){
  • str = str + "&check[]=" + y;
  • }
  • }
  • str=str.substring(1,str.length);
  • document.form.action = "action.php?" + str;
  • document.form.submit();
  • }
  • }
  • //-->
  • </script>
  • <!-- ... //-->
  • <form name="form" method="POST">
  • <input type="checkbox" name="list_check" value="0" OnClick="checkbox(0);" />1er choix
  • <input type="checkbox" name="list_check" value="1" OnClick="checkbox(1);" />2eme choix
  • <input type="checkbox" name="list_check" value="2" OnClick="checkbox(2);" />3eme choix
  • <input type="checkbox" name="list_check" value="4" OnClick="checkbox(4);" />4eme choix
  • <!-- ... //-->
  • </form>
  • //pour récupérer les données (action.php):
  • <?php
  • $array=array('1er choix','2eme choix','3eme choix','4eme choix','...');
  • $passage=$_GET['check'];
  • for($i=0;$i<count($check);$i++){
  • $check[$i]=$array[$passage[$i]];
  • }
  • ?>
<script language="javascript">
<!--
//nb max de choix possible
var nbre_max=3;
var nbre=0;
var url = new Array(nbre_max+1);
function checkbox(num){
	if((document.form.list_check[num].checked)==true){
		nbre++;
	} else {
		nbre--;
	}
	if(nbre > nbre_max){
		alert('Pas plus de 3 ateliers !');
		document.form.list_check[num].checked=false;
		nbre--;
	}
}
function verif(){
	if(nbre==0) {
		alert('Choisis un checkbox !');
		document.form.list_check[0].focus();
	} else {
		for(y=0; y<document.form.list_check.length; y++){
			if(document.form.list_check[y].checked == true){
				str = str + "&check[]=" + y;	
			}
		}
		str=str.substring(1,str.length);
		document.form.action = "action.php?" + str;
		document.form.submit();
	}
}
//-->
</script>
<!-- ... //-->
<form name="form" method="POST">
<input type="checkbox" name="list_check" value="0" OnClick="checkbox(0);" />1er choix
<input type="checkbox" name="list_check" value="1" OnClick="checkbox(1);" />2eme choix
<input type="checkbox" name="list_check" value="2" OnClick="checkbox(2);" />3eme choix
<input type="checkbox" name="list_check" value="4" OnClick="checkbox(4);" />4eme choix
<!-- ... //-->
</form>


//pour récupérer les données (action.php):
<?php
$array=array('1er choix','2eme choix','3eme choix','4eme choix','...');
$passage=$_GET['check'];
for($i=0;$i<count($check);$i++){
    $check[$i]=$array[$passage[$i]];
}
?>

 Conclusion

Et voilà.
la variable $check dans le code PHP contiendra (p.ex):
0 => '1er choix';
1 => '3eme choix';
2 => '4eme choix';
...

Je sais que cette source est aussi du PHP, mais le coeur (les checkbox) est en javascript. De plus, vous pouvez toujours récupérer le tableau de variables avec Javascript ou avec un autre langage (ASP ...) .


 Historique

29 novembre 2005 15:23:46 :
Ajout des mot-clés

 Sources de la même categorie

Source avec Zip Source avec une capture CALCULS RAYNAUX V2 par Ali Bibi
Source avec Zip Source avec une capture VALIDATION D'UN FORMULAIRE par grarestephane
Source avec Zip Source avec une capture CHAT VIRTUEL par grarestephane
Source avec Zip Source avec une capture AJOUTER ET SUPPRIMER DES FICHIERS DANS UNE LISTE par grarestephane
Source avec Zip TEXTAREA : LIMITER LA LARGEUR ET LA HAUTEUR DU TEXTE SAISIE par vilfarfadet
Toutes les sources de la catégorie Formulaire

 Sources en rapport avec celle ci

Source avec Zip MOOTABLEAU par Miky76
Source avec une capture JEU DE COULEURS DANS UN TABLEAU À 3 DIMENSION par Niidhogg
TRANSFORMER UN TABLEAU JAVASCRIPT EN UN TABLEAU HTML par pifou25
COCHER DES CASES DANS UN TABLEAU , CREÉ EN PHP AVEC POSSIBIL... par vandenplasfrederic
Source avec Zip DIVERSES FONCTIONS SIMPLES POUR LES TABLEAUX par Gorrk

Commentaires et avis

Commentaire de Mingain le 24/02/2006 21:39:46

Bonjour,

le code me renvoie l'erreur "'documen.form.list_check[...].checked' a la valeur Null ou n'est pas un objet."

Comment faire ?

A bientôt ;-)

Commentaire de kangun le 14/06/2006 15:55:50

merci bien pour ce petit script, il m'a en quelque sorte sauvé ;-)

Commentaire de monsieurzouzou le 31/10/2006 16:06:34

bonjour,

meme erreur que Mingain: "'document.form.list_check[...].checked' a la valeur Null ou n'est pas un objet."

snif en plus c'est le seul script du net qui correspond à ce que veux exactement...j'ai plus qu'à apprendre le javascript, ouinnnnnnnnn j'en ai pour des mois...

Commentaire de monsieurzouzou le 31/10/2006 17:33:00

bon ben finalement j'en ai trouvé un autre sur http://www.js-examples.com/, qui marche (énorme merci à eux :); la saisie est ici limitée à 2 checkbox:

<script type="text/javascript" language="JavaScript">
var MAX_ALLOWED=2;
var clickedData=new Array(false,false,false,false);
function itemsClicked(){var i=0;for(var j=0;j<clickedData.length;j++)i+=clickedData[j]?1:0;return(i);}
function itemClicked(_v)
{
  var ALLOW_THIS=true;
  var x=itemsClicked();
  if (x>=MAX_ALLOWED && !clickedData[_v])
  {
    ALLOW_THIS=false;
  }
  else
  {
    clickedData[_v]=clickedData[_v]?false:true;
eval("document.formulaire.r"+_v+".clicked=false;");
  }
  return (ALLOW_THIS); /* kill the event handler */
  
}
</script>
</head>
  
<body>
<form name="formulaire">
<INPUT name=r1 type=checkbox value=valeur1 onclick="return itemClicked(1)">Case 1  
<INPUT name=r2 type=checkbox value=valeur2 onclick="return itemClicked(2)">Case 2  
<INPUT name=r3 type=checkbox value=valeur3 onclick="return itemClicked(3)">Case 3  
<INPUT name=r4 type=checkbox value=valeur4 onclick="return itemClicked(4)">Case 4
</form>

</body>

Commentaire de lucky10g le 06/10/2007 20:42:10

Salut !
Monzieurzouzou ton script marche parfaitement
Maintenant quelqu'un peut me dire comment recevoir les variables ?
Merci a+

Commentaire de jdeheyn le 09/10/2007 15:56:12

Bonjour,
J'ai la même erreur que Mingain lorsque j'utilise ce script et que je ne coche qu'une seule case.
Je pense qu'il faudrait déclarer 'document.form.list_check' comme étant un tableau, mais néophyte dans le JavaScript, je ne sais pas trop comment faire ...

Commentaire de jdeheyn le 09/10/2007 16:01:00

Je me suis mal exprimé dans mon commentaire précédent ...
En fait l'erreur se produit si je n'ai qu'une seule case possible à cocher. Dans ce cas là, lorsque je coche la case j'ai cette erreur "'documen.form.list_check[...].checked' a la valeur Null ou n'est pas un objet."

Mais peut-être que mon idée de déclarer 'documen.form.list_check' comme étant un tableau pourrait résoudre le problème ...?

Commentaire de jdeheyn le 11/10/2007 16:04:12

J'ai trouvé une parade (merci bultez) pour cette erreur "'documen.form.list_check[...].checked' a la valeur Null ou n'est pas un objet."

En fait elle ne se pose que lorsqu'il n'y a qu'une case à cocher. Dans ce cas l'utilisation de 'document.form.list_check[num]' n'est pas possible.
Il suffit alors d'ajouter une "case invisible". Dans mon cas j'ai rajouté un champ de formulaire invisible : <INPUT TYPE="hidden" NAME="list_check" VALUE="" OnClick="checkbox(0)">.

Donc le nouveau code de Samiby devient :

<script language="javascript">
<!--
//nb max de choix possible
var nbre_max=3;
var nbre=0;
var url = new Array(nbre_max+1);
function checkbox(num){
if((document.form.list_check[num].checked)==true){
nbre++;
} else {
nbre--;
}
if(nbre > nbre_max){
alert('Pas plus de 3 ateliers !');
document.form.list_check[num].checked=false;
nbre--;
}
}
function verif(){
if(nbre==0) {
alert('Choisis un checkbox !');
document.form.list_check[0].focus();
} else {
for(y=0; y<document.form.list_check.length; y++){
if(document.form.list_check[y].checked == true){
str = str + "&check[]=" + y;
}
}
str=str.substring(1,str.length);
document.form.action = "action.php?" + str;
document.form.submit();
}
}
//-->
</script>
<!-- ... //-->
<form name="form" method="POST">
<INPUT TYPE="hidden" NAME="list_check" VALUE="" OnClick="checkbox(0)">
<input type="checkbox" name="list_check" value="0" OnClick="checkbox(1);" />1er choix
<input type="checkbox" name="list_check" value="1" OnClick="checkbox(2);" />2eme choix
<input type="checkbox" name="list_check" value="2" OnClick="checkbox(3);" />3eme choix
<input type="checkbox" name="list_check" value="4" OnClick="checkbox(4);" />4eme choix
<!-- ... //-->
</form>
//pour récupérer les données (action.php):
<?php
$array=array('1er choix','2eme choix','3eme choix','4eme choix','...');
$passage=$_GET['check'];
for($i=0;$i<count($check);$i++){
    $check[$i]=$array[$passage[$i]];
}
?>

Commentaire de monsieurzouzou le 11/10/2007 17:54:32

euh le cpde que j'ai collé (honteusement pompé je le rappelle) est quand même un peu plus simple...

Commentaire de monsieurzouzou le 11/10/2007 18:07:04

et désolé pour la faute de frappe: cpde = code si un modo passe par là, ça serait bien de rectifier parce que c'est très vilain :) ça m'apprendra à faire genre je sais taper

Commentaire de jdeheyn le 11/10/2007 18:19:56

Yes MONSIEURZOUZOU, ton code est plus simple à comprendre, mais je trouve qu'il ne va pas trop bien pour la création "dynamique" de formulaires, en PHP. Le fait de devoir utiliser des champs avec des noms "spécifiques" : r1, r2, r3, ... Je savais pas trop comment les traiter. Or avec le code de Samiby, on récupère les valeurs dans un tableau, ce que je trouve plus facile à manipuler ensuite en PHP.

Commentaire de kiadimoundi le 05/05/2008 09:15:35

bon, il est 9h12, j'ai peut être pas les yeux en face des trous, mais ton code me parait bizarre, surtout lors de la récupération des variables, je m'explique :
<form name="form" method="POST">
....
$passage=$_GET['check'];
-->>> ca serait pas plutot $passage=$_POST['check'];  ou alors <form name="form" method="GET">  ?????

ensuite dans le $_GET["..."], tu appelles une variable check, elle vient d'où ??? tu voulais plutot dire list_check ?

Au dela de ces deux détails, le code est très intéressant !!!:-D :-D

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Recherche dans un tableau js [ par dridri ] Bonjour,Voila j'ai une question qui m'embète pas mal. Je voudrais savoir s'il était possible de faire une recherche dans un tableau js contenant des d Checkbox dynamiques+contrôle [ par wolfe ] Bonjour,J'ai un formulaire généré dynamiquement à partir d'une bd Mysql avec l'affichage de 2 checkbox générées cochées ou non suivant la valeur des c Checkbox avec PHP/MySQL/JavaScript [ par montalto ] Bonjour,Je suis debutant dans la programmation web et j'aurais besoin d'aide, ou pluto de sources ;)voila je doit faire une page qui affiche un tablea La porté d'un array en javascript [ par maxxcbenny ] Bonjour,Comment faire pour passer un tableau de type array dans une fonction en javascript ?Parce que voici ce que j'ai codé :&lt;script language="Jav création dynamique d'un Tableau HTML depuis 1 array [ par durand2504 ] Bonjour, j'ai &#233;crit un script permettant de cr&#233;er un tableau HTML&nbsp; depuis un array. ce script fonctionnement tr&#232;s bien sous Bug avec array::length [ par Checker_Bobby ] Bonjour, je savais pas trop ou mettre la remarque suivante... J'ai constater un truc "bizarre" avec JavaScript qui m'a bien tordu l'esprit avant que j Création tableau javascript via php [ par Blacknight91titi ] Bonjour,J'ai ci dessous&nbsp;le morceau de code de mon script qui pose probl&#232;mepreview = new Array(&nbsp;&nbsp;&nbsp;&lt;?php&nbsp;&nbsp;&nbsp;<F Controler un tableau de chekbox [ par guiguimac ] Bonjour,j'ai un tableau de checkbox dans un formulaire :&lt;input name='Ref[]' type='checkbox' value='Ref_" + nRef +"'&gt;seule la valeur de "value" c Contrôle de checkbox [ par Zebra1928 ] Bonjour,j'ai le morceau de code suivant en PHP:&lt;form name="form1" method="post" action="page2.php"&gt;&lt;input  type="checkbox" name='supprimer[]' Trier tableau généré en js [ par way2web ] Bonjour,j'ai créé un script me permettant de générer un tableau html à partir de données stockées dans un array à 2 dimensions. L'affichage est correc


Nos sponsors


Sondage...

Comparez les prix


Console Nintendo Wii
Entre 220€ et 307€

Visiter le guide achat

CalendriCode

Février 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728

Consulter la suite du CalendriCode
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,546 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)