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>
            <div class="col-75">
                <label>
                    <input type="checkbox" value="all" onChange="toggleCheckboxes.call(this, 'operation[]')">
                         All
               </label><br>
                <label>
                    <input type="checkbox" name="operation[]" value="Addition" checked>
                     Addition
                </label><span class="checkmark"></span><br>
                <label>
                    <input type="checkbox" name="operation[]" value="Subtraction">
                       Subtraction
                </label><span class="checkmark"></span><br>
              </div>
        </div>

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.

1 Like

@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?

1 Like