Feb 19, 2009
admin

Check One Check All – Javascript

Hello Friends …..

You have seen in Yahoo,Gmail or in any Mail Service that they provide you to select all mail facility by check only one checkbox or click on link as Select All/Deselect All.

When you click on that lick or check that checkbox , your all mails on that page will be selected.

You think that how it does ?

This is done by Javascript .

In this Post, iwill give you that javascript which is used for select all purpose.

Here I give you whole code of that javascript with HTML form. In this coad there is some PHP code also.

<!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=iso-8859-1″ />
<title>Untitled Document</title>
<script type=”text/javascript” language=”javascript”>
function checkAll()
{
var i;

for(i=0;i<document.frm.elements.length; i++)
{
var elm  = document.frm.elements[i];
if(elm.type == “checkbox” && elm.name != “chkCheckAll” )
{
elm.checked =document.frm.chkCheckAll.checked;
}
}
}
function check()
{
var i;
var flag;
flag=1;
for(i=0;i<document.frm.elements.length; i++)
{
var elm  = document.frm.elements[i];
if(elm.type == “checkbox” && elm.name != “chkCheckAll” )
{
if(elm.checked==false)
{
flag=0;
}
}
}
if(flag==1)
{
document.frm.chkCheckAll.checked=true;
}
else
{
document.frm.chkCheckAll.checked=false;
}
}
</script>
</head>

<body>
<form id=”frm” name=”frm”>
<table width=”90%” border=”0″ align=”center” cellpadding=”0″ cellspacing=”0″>

<tr>
<td align=”left” valign=”top”>&nbsp;</td>
</tr>
<tr>
<td align=”left” valign=”top”><table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”0″>

</table></td>
</tr>
<tr>
<td align=”left” valign=”top”>&nbsp;</td>
</tr>
<tr>
<td align=”left” valign=”top” class=”tableBgWhite”><table width=”100%” border=”0″ cellpadding=”0″ cellspacing=”0″ class=”pagination”><tr><td align=”right” valign=”top”><table width=”100%” border=”0″ cellpadding=”0″ cellspacing=”0″ class=”pagination”>

</table></td>
</tr>
</table></td>
</tr>
<tr>
<td align=”left” valign=”top” class=”tableBgWhite”><table width=”100%” border=”0″ cellpadding=”0″ cellspacing=”0″ class=”tableListingBdr”>
<tr>
<th width=”4%” height=”20″ align=”left” valign=”top”><INPUT type=”checkbox” id=”chkCheckAll” name=”chkCheckAll” onClick=”javascript:checkAll();” align=”middle”>Select All/Deselect All</th>
</tr>

<?php for ($i=0 ; $i < 5 ; $i++)
{
?>
<tr >
<td align=”left” valign=”top”><input id=”list” type=”checkbox” name=”check[]” value=”<?php echo $i; ?>” onClick=”Javascript:return check();” /></td>
</tr>

<?php }?>
</table></td>
</tr>
<tr>
<td align=”right” valign=”top” class=”tableBgWhite”><table width=”100%” border=”0″ cellpadding=”0″ cellspacing=”0″ class=”pagination”>

</table></td>
</tr>

<tr>
<td align=”left” valign=”top”>&nbsp;</td>
</tr>
</table>
</form>
</body>
</html>

Just copy this code ,Paste it and saved by example.php in your PHP directory.

Then Run this page. If you want to see Demo then Click Here

If you have any query or question then please comment me. In next post I will give you code about delete those records which are selected by this checkbox. All these data deleted by one click.

PHP Genious Services

I am a PHP freelancer india, PHP Developer india, PHP programmer india, Wordpress Freelancer india, Wordpress customization services, Wordpress Plugin Developer, Wordpress theme customization, Wordpress plugin customization, Magento Freelancer, Magento Developer india, Magento customization services, Magento theme integration, Opencart Developer india, Zencart Freelancer, Opencart customization, Opencart plugin development, HTML and CSS customization, cakePHP Developer, cakePHP Freelancer india, Ecommerce Developer india

Click Here for

Follow me on Facebook

Categories

Get Adobe Flash playerPlugin by wpburn.com wordpress themes