• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 994
  • Last Modified:

add onclick event to disable button when checkboxes are not checked

Hi all,

I have a table that contains a list of checkboxes.

i need to create a function in JAVASCRIPT that will do the following:
 say i have 10 checkboxes .. one on each table row.
if a  user unchecks all of the check boxes i need to set disable=true to  button1
if all the check boxes are not unchecked then i need to set disable = false to button1

thanks
0
joan2006
Asked:
joan2006
1 Solution
 
hieloCommented:
Save this as test.html and try it.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title></title>
<script type="text/javascript">
function process( o )
{
	var sib = document.getElementsByTagName(o.tagName);
	var checked=0;
	for( var i=0; i < sib.length; ++i)
	{
		if( sib[i].name==o.name && sib[i].checked==true )
		{
			++checked;
		}
	}
 
	if( checked==(sib.length-1) )
	{
		document.getElementById("theButtonID").disabled=false;
	}
	else
	{
		document.getElementById("theButtonID").disabled=true;
	}
return true;
}
</script>
</head>
<body>
<table summary="">
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="checkbox" name="theCheckbox" onclick="process(this)" /></td></tr>
<tr><td><input type="button" name="theButton" id="theButtonID" value="Test" disabled="disabled" /></td></tr>
</table>
</body>
</html>

Open in new window

0
 
newbie27Commented:
Hello Hielo,
You probably trying to ignore me and my posts otherwise all my problems would have resolved by now, Please Hielo, if anything said or done wrong please forgive and please please help me ! i know you been busy helping others as well but I would be very grateful to you HIELO for your help on the List Manager project I am working on, I need your help and advice
Please help HIELO.
Thanks
S
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now