Tuesday, March 20, 2012

check uncheck all check box using javascript and jquery


Your ckname are
name 1
name 2
name 3
name 4
name 5
name 6

Select / Unselect All



<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script language="javascript">


function selectallCHBox(){



if($('#selectall').attr('checked')){
var inputs = document.getElementsByClassName('chechid');
var checkboxes = [];
for (var i = 0; i < inputs.length; i++) {

  if (inputs[i].type == 'checkbox') {
inputs[i].checked =true; } }
}
else {
var inputs = document.getElementsByClassName('chechid');
var checkboxes = [];
for (var i = 0; i < inputs.length; i++) {

  if (inputs[i].type == 'checkbox') {
inputs[i].checked =false; } }

}

}

</script>
</head>
<body>
<form name="form1" onSubmit="return validate()">
Your ckname are <br>
<input type="checkbox" name="ckname[]" class="chechid" value="blue" id="blue"> name 1 <br>
<input type="checkbox" name="ckname[]" class="chechid"  value="red" id="red">name 2 <br>
<input type="checkbox" name="ckname[]" class="chechid"  value="green" id="green">name 3 <br>
<input type="checkbox" name="ckname[]" class="chechid"  value="yellow" id="yellow">name 4 <br>
<input type="checkbox" name="ckname[]" class="chechid"  value="voilet" id="voilet">name 5 <br>
<input type="checkbox" name="ckname[]" class="chechid"  value="grey" id="grey">name 6 <br>
<br>
<input type="checkbox" name="selectall"  id="selectall" onClick="selectallCHBox();" />Select / Unselect All
</form>
</body>
</html>

No comments:

Post a Comment

If you Satisfied , Please Leave a comment