Checkbox validation

Checkbox validation in javascript and retrieve its value in PHP

Checkbox: It is an element in HTML which can be checked or unchecked. It is grouped on the basis of name.


In this tutorial we will learn about validation of checkbox in javascript and retrieve its value in PHP. Checkbox is classified in two types.

  • Multiple checkbox
  • Single checkbox

1. Multiple checkbox: You can select more than one checkbox, but atleast one checkbox must be selected. In PHP, you have to retrieve its value.

Form with multiple checkbox

<form name="frm" method="POST">
	Books:
	<input type="checkbox" name="chkBooks[]" id="electronics" value="Electronics"><label for="electronics">Electronics</label>
	<input type="checkbox" name="chkBooks[]" id="radar" value="radar"><label for="radar">Radar</label>
	<input type="checkbox" name="chkBooks[]" id="maths" value="maths"><label for="maths">Maths</label>
	<input type="checkbox" name="chkBooks[]" id="physics" value="physics"><label for="physics">Physics</label>
	<input type="checkbox" name="chkBooks[]" id="signal" value="signal"><label for="signal">Signal system</label>
	<input type="checkbox" name="chkBooks[]" id="telephony" value="telephony"><label for="telephony">Telephony</label>
	
	<input type="submit" name="submit" value="submit" onclick="return validChk()" />
</form>

Javascript validation for multiple checkbox

<script>
	function validChk() {
		var chkBox = document.getElementsByName('chkBooks[]');
		var lenChkBox = chkBox.length;
		//alert(lenChkBox)
		var valid=0;
		for(var i=0;i<lenChkBox;i++) {
			if(chkBox[i].checked==true) {
				valid=1;
				break;
			}
		}
		if(valid==0) {
			msg='Please select atleast one book';
			alert(msg);
			return false;
		}
		return true;
	}
</script>

In PHP you will get all checked values

<?php
if(isset($_POST['submit'])) {	//If form gets submitted
	print_r($_POST['chkBooks']);
}
?>


2. Single checkbox: Sometimes you have single checkbox and you have to validate it and retrieve its value in PHP. e.g. You have to agree to terms and condition

<form name="frmTerms" method="POST">
	<input type="checkbox" name="terms" id="terms" value="1"><label for="terms">Agree to terms and condition</label>
	<input type="submit" name="submit" value="submit" onclick="return validChk()" />
</form>

Javascript validation for single checkbox

<script>
	function validChk() {
		var chkVal = document.frmTerms.chkTerms.checked;
		if(chkVal==false) {
			msg='Please agree to terms and condition';
			alert(msg);
			return false;
		}
		return true;
	}
</script>

In PHP you get checked values

<?php
if(isset($_POST['submit1'])) {	//If form gets submitted
	print_r($_POST['chkTerms']);
}
?>
Name
Email
Comments
Back
Funding

We need your support to operate it properly. We have lots of ideas but less fund, so help us with your funding.

Contribute

Thoughts of the day

A perfection of means, and confusion of aims, seems to be our main problem

Albert Einstein
Sell your product online

Do you want to sell products online with no extra cost?

Send your details, our executive will contact you

Email:

Mobile:

Location:

Polls
What you like most in facebook?
News
20%

 


Games
40%

 


Images
40%

 


Videos

Tutorial On Request
Q. Ask us for any tutorial or any thing which helps to build your career better.
Email:
Query: