Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery validate check at least one checkbox

I have something like this:

<form> <input name='roles' type='checkbox' value='1' /> <input name='roles' type='checkbox' value='2' /> <input name='roles' type='checkbox' value='3' /> <input name='roles' type='checkbox' value='4' /> <input name='roles' type='checkbox' value='5' /> <input type='submit' value='submit' /> <form> 

I would like to validate that at least one checkbox (roles) should be checked, is it possible with jquery.validate ?

like image 863
Omu Avatar asked Jun 14 '10 07:06

Omu


People also ask

Can I use jQuery to check whether at least one checkbox is checked?

$('#frmTest input[type="checkbox"]').is(':checked')){ alert("Please check at least one."); return false; } }); is(':checked') will return true if at least one or more of the checkboxes are checked. Is it possible for this to check on live checkbox clicks? Yes, but you would use a different event handler.

How do you validate that at least one checkbox should be selected?

This way, when saving to db, the value will always be there, 0 or 1. $rules = [ 'checkbox1' => 'required_without_all:checkbox2,checkbox3', 'checkbox2' => 'required_without_all:checkbox1,checkbox3', 'checkbox3' => 'required_without_all:checkbox1,checkbox2', ];

How do I validate a checkbox?

Checking if a checkbox is checked First, select the checkbox using a DOM method such as getElementById() or querySelector() . Then, access the checked property of the checkbox element. If its checked property is true , then the checkbox is checked; otherwise, it is not.

How can we make checkbox required field in jQuery?

$('#form1'). submit(function() { if ($('input:checkbox', this).is(':checked') && $('input:radio', this).is(':checked')) { // everything's fine... } else { alert('Please select something! '); return false; } });


1 Answers

Example from https://github.com/ffmike/jquery-validate

 <label for="spam_email">      <input type="checkbox" class="checkbox" id="spam_email" value="email" name="spam[]" validate="required:true, minlength:2" /> Spam via E-Mail </label>  <label for="spam_phone">      <input type="checkbox" class="checkbox" id="spam_phone" value="phone" name="spam[]" /> Spam via Phone </label>  <label for="spam_mail">      <input type="checkbox" class="checkbox" id="spam_mail" value="mail" name="spam[]" /> Spam via Mail </label>  <label for="spam[]" class="error">Please select at least two types of spam.</label> 

The same without field "validate" in tags only using javascript:

$("#testform").validate({      rules: {              "spam[]": {                      required: true,                      minlength: 1              }      },      messages: {              "spam[]": "Please select at least two types of spam."     }  });  

And if you need different names for inputs, you can use somethig like this:

<input type="hidden" name="spam" id="spam"/> <label for="spam_phone">     <input type="checkbox" class="checkbox" id="spam_phone" value="phone" name="spam_phone" /> Spam via Phone</label> <label for="spam_mail">     <input type="checkbox" class="checkbox" id="spam_mail" value="mail" name="spam_mail" /> Spam via Mail </label> 

Javascript:

 $("#testform").validate({      rules: {          spam: {              required: function (element) {                 var boxes = $('.checkbox');                 if (boxes.filter(':checked').length == 0) {                     return true;                 }                 return false;             },             minlength: 1          }      },      messages: {              spam: "Please select at least two types of spam."     }  });  

I have added hidden input before inputs and setting it to "required" if there is no selected checkboxes

like image 91
sir_neanderthal Avatar answered Oct 11 '22 11:10

sir_neanderthal