Saturday 25 May 2013

Jquery multiple checkbox check to enable button



Select single checkbox and a submit button that is initially disabled. When checking a box the button is enabled and when unchecking , the button is disabled again.
if two checkboxes checked then button is disabled, if one check box is checked then button is enabled. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery multiple checkbox check to enable button</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
$(document).ready( function(){
$('.chkbox').click( function() {
    if ($('.chkbox:checked').length==1) {
$('#add1').removeAttr("disabled");
$('#add2').removeAttr("disabled");
}
else{
$('#add1').attr("disabled","true");
$('#add2').attr("disabled","true");
}
});
});
</script>
</head>
<body>
<h3>Select atleast one checkbox to enable button</h3>
<br />
<input type="checkbox" class="chkbox" /><br />
<input type="checkbox" class="chkbox"/><br />
<input type="checkbox" class="chkbox"/><br />
<input type="checkbox" class="chkbox"/><br />
<input type="checkbox" class="chkbox"/>
<br />
<input id='add1' type='button' value='Submit' disabled='disabled'>
<input id='add2' type='button' value='Submit' disabled='disabled'>
<h3>Try to select two checkboxs to enable button</h3>
</body>
</html>


Jquery multiple checkbox check to enable button

Select atleast one checkbox to enable button







Try to select two checkboxs to enable button

No comments:

Post a Comment

Do you think it could be useful for you? Share your thoughts with us!