How to add the validation to these checkboxes? Where I am going wrong?


this is my html code for checkboxes input field

    <div class="row">
            <div class="col-25">
                <label>Select operations:</label>
            <div class="col-75">
                    <input type="checkbox" value="all" onChange=", 'operation[]')">
                    <input type="checkbox" name="operation[]" value="Addition" checked>
                </label><span class="checkmark"></span><br>
                    <input type="checkbox" name="operation[]" value="Subtraction">
                </label><span class="checkmark"></span><br>

I want to add the validation to these checkboxes , If no checkboxes selected then after clicking on submit button it should show messahe like please select at least one checkbox ,
I tried this with my submit button but its not working

    <input type="button" name="submit" value="GENERATE" id="gen" onclick="if(!this.form.operation[].checked){alert('You must select at least one oeration.'); return false}">

how can I do this ?


This is one of those things that is easier with jQuery or another framework than without, but…

Essentially you’d have to call a function that counts the number of checked checkboxes and reacts appropriately.


@m_hutley hey I did this

  function checkForm()
if(!form.operation[].checked) {
  alert("Please slelect at least one operation");
  return false;
return true;

  <input type="button" name="submit" value="GENERATE" id="gen" onsubmit="return checkForm();">

but still not working


Thread continues here: Whats wrong with this javascript code to validate the checkbox field?