Debt Consolidation - Health 2007 - Valentine's Day Gifts - Bollywood India forum movie reviews - Debt Consolidation
PDA

View Full Version : checking all checkboxes

gilgalbiblewheel
Aug 22nd 2008, 12:43 pm
any tutorial for checking or selecting all checkboxes?
ghprod
Aug 22nd 2008, 12:54 pm
i'm looking for this too :)

anyone can help?
gilgalbiblewheel
Aug 22nd 2008, 1:39 pm
hmm...mabe this will help:
http://www.shiningstar.net/articles/articles/javascript/checkboxes.asp
gilgalbiblewheel
Aug 22nd 2008, 2:29 pm
Ok that DOES work but not what I'M looking for:
<!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>
<SCRIPT LANGUAGE="JavaScript">
<!--
// by Nannette Thacker
// http://www.shiningstar.net
// This script checks and unchecks boxes on a form
// Checks and unchecks unlimited number in the group...
// Pass the Checkbox group name...
// call buttons as so:
// <input type=button name="CheckAll" value="Check All"
//onClick="checkAll(document.myform.list)">
// <input type=button name="UnCheckAll" value="Uncheck All"
//onClick="uncheckAll(document.myform.list)">
// -->

<!-- Begin
function checkAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = true ;
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = false ;
}
// End -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<form name="myform" action="checkboxes.asp" method="post">
<b>Your Favorite Scripts & Languages</b><br>
<input type="checkbox" name="list" value="1">Java<br>
<input type="checkbox" name="list" value="2">Javascript<br>
<input type="checkbox" name="list" value="3">Active Server Pages<br>
<input type="checkbox" name="list" value="4">HTML<br>
<input type="checkbox" name="list" value="5">SQL<br>

<input type="button" name="CheckAll" value="Check All"
onClick="checkAll(document.myform.list)">
<input type="button" name="UnCheckAll" value="Uncheck All"
onClick="uncheckAll(document.myform.list)">
<br>
</form>
</body>
</html>

They've using two buttons to make it work. I need One checkbox instead of the two buttons. A simple check and uncheck o make it work.
gilgalbiblewheel
Aug 22nd 2008, 3:06 pm
Well I got this far:
<!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>
<SCRIPT LANGUAGE="JavaScript">
<!--
// by Nannette Thacker
// http://www.shiningstar.net
// This script checks and unchecks boxes on a form
// Checks and unchecks unlimited number in the group...
// Pass the Checkbox group name...
// call buttons as so:
// <input type=button name="CheckAll" value="Check All"
//onClick="checkAll(document.myform.list)">
// <input type=button name="UnCheckAll" value="Uncheck All"
//onClick="uncheckAll(document.myform.list)">
// -->

<!-- Begin
function checkAll(field)
{
for (i = 0; i < field.length; i++)
{
document.getElementsByName('list')[i].checked = true;
//field[i].checked = true ;
}
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
{
document.getElementsByName('list')[i].checked = false;
//field[i].checked = false ;
}
}
// End -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Check/Uncheck All Checkboxes</title>
</head>
<body>
<form name="myform" action="checkboxes.asp" method="post">
<b>Your Favorite Scripts & Languages</b><br>
<input type="checkbox" name="list" value="1">Java<br>
<input type="checkbox" name="list" value="2">Javascript<br>
<input type="checkbox" name="list" value="3">Active Server Pages<br>
<input type="checkbox" name="list" value="4">HTML<br>
<input type="checkbox" name="list" value="5">SQL<br>

<input type="checkbox" name="CheckAll" value="Check All"
onClick="if(this.checked = 'false'){document.getElementById('write').value='hi'; checkAll(document.myform.list);} else{document.getElementById('write').value='bye';uncheckAll(document.myform.list);}" />
<input type="text" id="write" value="" />
<br>
</form>
</body>
</html>

Still there's something wrong with the if statements.
gilgalbiblewheel
Aug 22nd 2008, 3:17 pm
Bingo!
Here's the solution:
<!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>Check/Uncheck All Checkboxes</title>
<SCRIPT LANGUAGE="JavaScript">
function checkAll(field)
{
for (i = 0; i < field.length; i++)
{
document.getElementsByName('list')[i].checked = true;
//field[i].checked = true ;
}
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
{
document.getElementsByName('list')[i].checked = false;
//field[i].checked = false ;
}
}
</script>
</head>
<body onLoad="uncheckAll(document.myform.list); document.getElementById('check_uncheck_all').checked = false;">
<form name="myform" action="checkboxes.asp" method="post">
<b>Your Favorite Scripts & Languages</b><br>
<input type="checkbox" name="list" value="1">Java<br>
<input type="checkbox" name="list" value="2">Javascript<br>
<input type="checkbox" name="list" value="3">Active Server Pages<br>
<input type="checkbox" name="list" value="4">HTML<br>
<input type="checkbox" name="list" value="5">SQL<br>

<input type="checkbox" id="check_uncheck_all" name="CheckAll" value="Check All"
onClick="if(this.checked == true){document.getElementById('write').value='hi'; checkAll(document.myform.list);} else{document.getElementById('write').value='bye'; uncheckAll(document.myform.list);}" />
<input type="text" id="write" value="" />
<br>
</form>
</body>
</html>

You might not need the textbox.
gilgalbiblewheel
Aug 22nd 2008, 3:41 pm
Even better. I replaced document.myform.list by document.getElementsByName(). It's an old code.
<!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>Check/Uncheck All Checkboxes</title>
<script language="JavaScript">
function checkAll(field)
{
for (i = 0; i < field.length; i++)
{
document.getElementsByName('list')[i].checked = true;
//field[i].checked = true ;
}
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
{
document.getElementsByName('list')[i].checked = false;
//field[i].checked = false ;
}
}
</script>
</head>
<body onLoad="uncheckAll(document.myform.list); document.getElementById('check_uncheck_all').checked = false;">
<form name="myform" action="checkboxes.asp" method="post">
<b>Your Favorite Scripts & Languages</b><br>
<input type="checkbox" name="list" value="1">Java<br>
<input type="checkbox" name="list" value="2">Javascript<br>
<input type="checkbox" name="list" value="3">Active Server Pages<br>
<input type="checkbox" name="list" value="4">HTML<br>
<input type="checkbox" name="list" value="5">SQL<br>

<input type="checkbox" id="check_uncheck_all" name="CheckAll" value="Check All"
onClick="if(this.checked == true){document.getElementById('write').value='hi'; checkAll(document.getElementsByName('list'));} else{document.getElementById('write').value='bye'; uncheckAll(document.getElementsByName('list'));}" />
<input type="text" id="write" value="" />
<br>
</form>
</body>
</html>
ghprod
Aug 23rd 2008, 11:17 am
@gilgalbiblewheel

Thnx for ur hard work :D
gilgalbiblewheel
Aug 23rd 2008, 1:07 pm
Without any help from others! Sometimes if you spend time on www.w3schools.com and some code examples you notice that you'll find the solution.
ghprod
Aug 24th 2008, 12:11 pm
Now its work prefectly :D

Thnx