Checkbox maximum 5Résolu

Question

Bonjour,

J'ai un formulaire contenant une centaine de checkbox nomé comme suit :




...

J'ai une petite fonction JS (chkcontrol) qui me permet que l'utilisateur ne puisse cocher que maximum 3 checkbox, et que si il dépasse ce nombre, une alerte s'affiche.
Seulement cette fonction que j'ai trouvé sur le net ne fonctionne normalement que si le name="" de mes checkbox ont exactement le même nom.

Voici la fonction :

function chkcontrol(j) {
    var total=0;
    for(var i=0; i < document.choixzik.ckb.length; i++){
      if(document.choixzik.ckb[i].checked){
      total =total +1;}
      if(total > 3){
        alert("Tu ne peux séléctionner que 3 checkbox !") 
        document.choixzik.ckb[j].checked = false ;
        return false;
      }
    }
  }

Ma question est donc : comment adapter cette fonction pour qu'elle fonctionne avec des checkbox de noms différents (comme montré ci-dessus) ?

D'avance merci pour vos pistes :-)

Bonne journée,
Fabien

Bul3 · Accepted Answer

bonjour,

>>ne fonctionne normalement que si le name="" de mes 
>>checkbox ont exactement le même nom. 
ben oui... c'est bien plus simple à gérer
y compris coté serveur !
mais enfin, si tu tiens à tout prix à
te compliquer la vie :

var n=1;
while ( document.name_du_formulaire["ckb"+n] )
{   traitement de document.name_du_formulaire["ckb"+n] 
    n++
}
@+

fabienfs · Answer

merci bul3,

par contre je ne vois pas très bien quoi englober dans ma while.
actuellement j'ai fait ceci :

  function chkcontrol(j) {
    var total=0;
    var n=1; 
    while (document.choixzik.ckb[n]) 
    {
      for(var i=0; i < document.choixzik.ckb.length; i++){
        if(document.choixzik.ckb[i].checked){
        total =total +1;}
        if(total > 3){
          alert("5 heckbox max !") 
          document.choixzik.ckb[j].checked = false ;
          return false;
        }
      }
      n++;
    }
  }

mais ce ne doit pas être ca.

tu peux m'éclairer ?

merci.

fab

Bul3 · Answer

bah... j'ai pourtant dit, non ?
...   traitement de document.name_du_formulaire["ckb"+n] ...


fonction chkcontrol()
{ var n=1;
  var total=0;
  while ( document.choixzik["ckb"+n] ) 
  { if ( document.choixzik["ckb"+n].checked )
    { total++;
      if ( total > 5 )
      {  alert("5 checkbox max !");
         return false;  
      }
    }
    n++;
  }
  return true;
}

fabienfs · Answer

ok je vois,
ca marche impec.
j'ai juste rajouter document.choixzik["ckb"+n].checked = false; car le return false; ne suffit pas à décocher celui qui est en trop.

merci à toi !

bonne journée,

fab

Bul3 · Answer

bien entendu, "même chose" coté serveur....
alors qu'avec les même name, c'est un array qui est géré
c'est bien plus simple

Bul3 · Answer

>>ne suffit pas à décocher celui qui est en trop. 
certes... mais 
_ comme tu sors de la fonction,
  si tu en coches 25, il en restera 19 cochés en trop ;o)
_ tu ne décoche peut-être pas celui qu'il faut

fabienfs · Answer

effectivement,
mais comment décocher le bon quand il y en plus que 5 déjà cochés après l'affiche du alert ?

Bul3 · Answer

à priori, je dirais : tu ne peux pas !
comment veux-tu deviner "l'erreur" de l'internaute ?
il peut avoir coché n'importe lesquels en trop.
et comme déjà dis, ça ne pourrait "marchouiller"
que pour 6 checkbox cochés. et pour 25 ?

Bul3 · Answer

ou alors, il faut contrôler à 
chaque click sur un checkbox quelconque.
remarque que c'est peut-être ce que tu fais ?
donc dans ce cas décocher le dernier ? celui cliqué ?

fabienfs · Answer

oui c'était mon but au départ, pour ca que j'avais mis pour chaques checkbox un onclick="mafonction(ckb1); pour décocher le dernier cliquer si on dépasse le nombre total, mais la je vois pas comment gérer ce système

Bul3 · Answer

..onclick= mafonction(this)...
et dans mafonction(chk)
     "quand il le faut"  : chk.checked =false;

fabienfs · Answer

ok, ca fonctionne.

voici mon code final :

  function chkcontrol(j) 
  { var n=1; 
    var total=0; 
    while ( document.choixzik["ckb"+n] ) 
    { if ( document.choixzik["ckb"+n].checked ) 
      { total++; 
        if ( total > 5 ) 
        {  alert("Tu peux séléctionner 5 titres maximum !"); 
           document.choixzik["ckb"+j].checked = false ;
           return false;   
        } 
      } 
      n++; 
    } 
    return true; 
  }

Bul3 · Answer

ah non alors !!!!
alert("vousnepouvez sélectionner que 5 titres au maximum !");

fabienfs · Answer

il est génial Bul3 ! en plus de savoir résoudre mon soucis javascript, il corrige même mon orthographe :D

merci à toi :))

Bul3 · Answer

tu as compris que c'était de l'humour j'aurais du mettre les balises ... oubli impardonnable. néanmoins ( ou handicapé nasal ) j'eusse utilisé this, na ! mais chacun ses goûts, ça ne fait pas le moine.

Checkbox maximum 5

15 réponses

Votre réponse