How to validate the checkbox using Jquery?
In the HTML form have multiple chekcbox in same using html array element. That time we will use three types of checkbox validation for checked or not.
Multiple checkbox validation has three types.
Take the below html/aspx code likes ...
1. Checkbox validation using Id
2. Checkbox validation using Name
Replace the function name from 'validateId' to 'validateName' in the above html/aspx code.
3. Checkbox validation using Div tag
Replace the function name from 'validateName' to 'validateDiv' in the above html/aspx code.
4. Single checkbox validation.
Enjoy the technology!
In the HTML form have multiple chekcbox in same using html array element. That time we will use three types of checkbox validation for checked or not.
Multiple checkbox validation has three types.
- Checkbox validation using Id
- Checkbox validation using name
- Checkbox validation using div tag
Take the below html/aspx code likes ...
<form>
<div id="checkboxId">
<input type="checkbox" name="chkBox[]" id="chkBox[]">
<input type="checkbox" name="chkBox[]" id="chkBox[]">
<input type="checkbox" name="chkBox[]" id="chkBox[]">
</div>
<input type="button" name="Btnaction"
value="submit" onclick="return validateId();">
</form>
</div>
// Calling jquery file.
<script language="javascript" src="jquery.js" type="text/javascript"></script>
1. Checkbox validation using Id
<script language="javascript">
function validateId()
{
var selector_checked = $("input[@id=chkBox]:checked").length;
alert(selector_checked);
if (selector_checked == 0)
{
return false;
}
else if (selector_checked == 0)
{
return false;
}
else
{
return true;
}
}
</script>
2. Checkbox validation using Name
Replace the function name from 'validateId' to 'validateName' in the above html/aspx code.
function validateName()
{
var selector_checked = $("input[@name=chkBox]:checked").length;
alert(selector_checked);
if (selector_checked == 0)
{
return false;
}
else if (selector_checked == 0)
{
return false;
}
else
{
return true;
}
}
3. Checkbox validation using Div tag
Replace the function name from 'validateName' to 'validateDiv' in the above html/aspx code.
function validateDiv()
{
if($("#checkboxId input[type='checkbox']:checked").length > 0)
{
return true;
}
}
4. Single checkbox validation.
<div>
<input type="checkbox" name="chkBox[]" id="chkTCAgree" />Agree terms and condition
text here<br />
<input type="button" name="Btnaction" value="submit" onclick="return validateTC();" />
</div>
function validateTC() {
var agree = $('#chkTCAgree').attr('checked');
if (!agree) {
alert("please accept the terms and conditions");
return false;
}
}
Enjoy the technology!