Thursday, May 16, 2013

Select/unselect multi checkbox fields using Javascript and HTML

The following code allows you to select multiple fields without having to select each check-box one by one. This code is allows you to delete and/or modify several items with one click.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> check all </title>

<meta http-equiv="Content-type" value="text/html; charset=UTF-8" />

<script type="text/javascript" language="javascript">
function chkall()
{
 var count=0; 
  var a=0; 
 count=document.frm.id.length; 
 for(a=0;a<count;a++)
 {
 if (document.frm.id[0].checked==false) 
 {
 document.frm.id[a].checked=false;
 }
 else if(document.frm.id[0].checked==true)
 {
 document.frm.id[a].checked=true;
 }
 }
}
</script>


</head>

<div  style="width:600px; margin:0px auto">
<form name="frm" id="frm" action="" method="post">
<b>Select/Unselect All</b><br>
<div style="background:#ccc;"><input name="id[]" id="id" type="checkbox" onclick="chkall();" /></div><br><br>

<input type="checkbox" name="id[]" value="1" id="id">
<input type="checkbox" name="id[]" value="2" id="id">
<input type="checkbox" name="id[]" value="3" id="id">
<input type="checkbox" name="id[]" value="4" id="id">
<input type="checkbox" name="id[]" value="5" id="id">
<input type="checkbox" name="id[]" value="6" id="id">

</form>
</div>
</body>
</html>