checking at least one checkbox javascript

Question

I need to check at least one checkbox, don't know why it's not working !! help please

ss=0;
for (i=0;i<=4;i++) 
{
if (document.f.cat[i].checked)

ss++; 
} 
if (ss==0){
alert("Please check at least one ");
return false;
}


> <p><input type="checkbox" name="cat1" value="ON">Art1     <input
> type="checkbox" name="cat2" value="ON">Art2   <input type="checkbox"
> name="cat3" value="ON">Art3   <input type="checkbox" name="cat4"
> value="ON">Art 4</p>

Answer 1

You can use document.querySelectorAll('.checkbox input[type="checkbox"]:checked') to find the checked checkbox.

 var btn = document.getElementById('check'); var msg = document.getElementById('checkedValue'); btn.addEventListener('click', function() { var len = document.querySelectorAll('.checkbox input[type="checkbox"]:checked').length if (len <= 0) { msg.innerHTML = "Please check at least one"; } else { msg.innerHTML = "Your have checked <span style='color:red'>" + len + "</span> checkbox"; } })

 body { font: 13px verdana }

 <p class="checkbox"> <input type="checkbox" name="cat1" value="ON">Art1 <input type="checkbox" name="cat1" value="ON">Art2 <input type="checkbox" name="cat1" value="ON">Art3 <input type="checkbox" name="cat1" value="ON">Art4 <input type="button" name="check" id="check" value="Check"> </p> <p id="checkedValue"></p>

Answer 2

Check with this script:

  <input type="checkbox" name="cat1" value="ON">Art1
  <input type="checkbox" name="cat1" value="ON">Art2
  <input type="checkbox" name="cat1" value="ON">Art3
  <input type="checkbox" name="cat1" value="ON">Art4
  <button type="button" onclick="checkValues()">Click</button>


    var validate = false;
     function checkValues() {
        $('input[type=checkbox]').each(function () {
           alert(this.checked);
           if(this.checked) {
             validate = true;
             return false;
           }
        });
     }

Then handle validate inside if

if(validate) {
   // do something
}

Answer 3

you mean something like this?

at first i'd assign a unique Id to each element.

<input type="checkbox" id="cat1" value="ON">Art1
<input type="checkbox" id="cat2" value="ON">Art2
<input type="checkbox" id="cat3" value="ON">Art3
<input type="checkbox" id="cat4" value="ON">Art4

var clicked = false;
for (i = 0; i <= 4; i++) {
  if($('#cat'+[i]).is(':checked'))  {
    clicked = true;
    return;
  }
}
if(clicked == false) {
  document.getElementById("cat"+[1]).checked;
}

Answer 4

In your post not too much complete. I created following scenario to provide you answer.

<p>
<input type="checkbox" name="cat1" value="ON">Art1
<input type="checkbox" name="cat1" value="ON">Art2
<input type="checkbox" name="cat1" value="ON">Art3
<input type="checkbox" name="cat1" value="ON">Art4
</p>
<p><button type="button" onClick="checkIsChecked()">Check Options</button></p>

JS:

function checkIsChecked(){

    var inputs = document.getElementsByTagName('input');
    var flag = false;

    for(var i = 0; i < inputs.length; i++) {
        if(inputs[i].checked) {
            flag = true;
        }
    }

    if(!flag){
        alert("Please check at least one ");
        return false;
    }
}

Answer 5

if(($("#checkboxid1").is(":checked")) || ($("#checkboxid2").is(":checked"))
                || ($("#checkboxid3").is(":checked"))) {
     //Your Code here
    }

You can use this code to verify that checkbox is checked at least one.

Thanks!!