2010-12-14 57 views
3

Salut tous J'ai un groupe de case à cocher ayant même nom afin d'obtenir le tableau de variable unique lorsqu'elle est affichée sur Serverside pour exampleLComment valider pour la sélection de case à cocher si toutes les cases ont le même nom?

<input type="checkbox" name="midlevelusers[]" value="1"> 
<input type="checkbox" name="midlevelusers[]" value="1"> 
<input type="checkbox" name="midlevelusers[]" value="1"> 
<input type="checkbox" name="midlevelusers[]" value="1"> 

je besoin d'une validation javascript pour vérifier si une case à cocher est sélectionné ou non?

Merci et salutations

NOTE: J'ai besoin javascript validation

Répondre

6
<form name="myform" method="POST" action="" onsubmit="return checkTheBox();"> 
    <input type="checkbox" name="midlevelusers[]" value="1" /> 1 &nbsp;&nbsp; 
    <input type="checkbox" name="midlevelusers[]" value="2" /> 2 &nbsp;&nbsp; 
    <input type="checkbox" name="midlevelusers[]" value="3" /> 3 &nbsp;&nbsp; 
    <input type="checkbox" name="midlevelusers[]" value="4" /> 4 &nbsp;&nbsp; 
    <input type="checkbox" name="midlevelusers[]" value="5" /> 5 &nbsp;&nbsp; 
    <input type="submit" value="Submit Form" /> 
</form> 

<script type="text/javascript"> 
    function checkTheBox() { 
    var flag = 0; 
    for (var i = 0; i< 5; i++) { 
     if(document.myform["midlevelusers[]"][i].checked){ 
     flag ++; 
     } 
    } 
    if (flag != 1) { 
     alert ("You must check one and only one checkbox!"); 
     return false; 
    } 
    return true; 
    } 
</script> 
5

Vous pouvez accéder aux éléments DOM et vérifier leurs biens checked. Par exemple:

var list, index, item, checkedCount; 

checkedCount = 0; 
list = document.getElementsByTagName('input'); 
for (index = 0; index < list.length; ++index) { 
    item = list[index]; 
    if (item.getAttribute('type') === "checkbox" 
     && item.checked 
     && item.name === "midlevelusers[]") { 
     ++checkedCount; 
    } 
} 

Live example

Il nous regardant à travers tout le document , ce qui peut ne pas être efficace. Si vous avez un conteneur autour de ceux-ci (et probablement un élément form), vous pouvez donner un ID à cet élément et ne regarder que dans celui-ci (seules les lignes var, form = et list = sont nouvelles/différentes):

var form, list, index, item, checkedCount; 

checkedCount = 0; 
form = document.getElementById('theForm'); 
list = form.getElementsByTagName('input'); 
for (index = 0; index < list.length; ++index) { 
    item = list[index]; 
    if (item.getAttribute('type') === "checkbox" 
     && item.checked 
     && item.name === "midlevelusers[]") { 
     ++checkedCount; 
    } 
} 

Live example


hors sujet: Vous ne l'avez pas mentionné l'aide d'une bibliothèque, donc je n'ai pas utilisé un au-dessus, mais FWIW ce genre de choses est beaucoup plus facile si y ou utilisez-en un comme jQuery, Prototype, YUI, Closure ou any of several others. Par exemple, avec jQuery:

var checkedCount = $("input[type=checkbox][name^=midlevelusers]:checked").length; 

Live example D'autres bibliothèques seront similaires, bien que les détails peuvent varier.

+0

Merci pour l'affichage de la méthode jQuery - beaucoup plus facile que ce que je faisais avant. –

3

utilisation

de id
<input type="checkbox" name="midlevelusers[]" id="mlu1" value="1"> 
<input type="checkbox" name="midlevelusers[]" id="mlu2" value="2"> 
<input type="checkbox" name="midlevelusers[]" id="mlu3" value="3"> 
<input type="checkbox" name="midlevelusers[]" id="mlu4" value="4"> 

maintenant vous pouvez faire

for (var i=1;i<5;i++){ 
    var el = document.getElementById('mlu'+i); 
    if (el.checked) { /* do something */} 
} 
0

Cette fonction alerterait si oui ou non une case à cocher a des valeurs vérifiées.

function isChecked(checkboxarray){ 
    for (counter = 0; counter < checkboxarray.length; counter++){ 
     if (checkboxarray[counter].checked){ 
      alert("Checkbox has at least one checked"); 
     else{ 
      alert("None checked"); 
     } 

Vous auriez besoin d'ajouter un peu plus à faire ce que vous voulez vraiment faire avec elle, mais que vous obtiendrez sur la bonne voie, je pense!

3

essayer,

function validate() { 
    var chk = document.getElementsByName('midlevelusers[]') 
    var len = chk.length 

    for(i=0;i<len;i++) 
    { 
     if(chk[i].checked){ 
     return true; 
      } 
    } 
    return false; 
    } 
0

Vous pouvez utiliser jQuery et de le faire de cette façon:

if($('input[name="light[]"]:checked').length < 1){ 
      alert("Please enter the light conditions"); 
}