Enable/disable checkboxes

JavaScript
1

Hi Guys!

I have written the following script which enables/disables checkboxes on my page when a radio button is selected.


<script language="JavaScript" type="text/javascript">
<!--
function disableCheckboxes(){
	document.watching.notify_1.disabled = true;
	document.watching.notify_2.disabled = true;
	document.watching.notify_3.disabled = true;
}

function enableCheckboxes(){
	document.watching.notify_1.disabled = false;
	document.watching.notify_2.disabled = false;
	document.watching.notify_3.disabled = false;
}
//-->
</script>

What I would like to do is create another function called checkval() like below, which will check the value of my radio button (id: email_alerts). If the value is equal to “on” then it will run enableCheckboxes().

Anyone know how I can do it? I need to do something like this:


checkVal(){
if(document.watching.email_alerts[0].value = "on"){
enableCheckboxes();
}
}

What would be the proper syntax?

2

May be …


function checkVal()
{
    if (document.watching.email_alerts[0].checked)
    {
        enableCheckboxes();
    }
}

It’s based on the “checked” property. The “on” value is send when summiting the page i think.

See you :cool:

3

Here is a script that allows you to enable/disable several checkboxes when you click a radio button.

[HIGHLIGHT=“”]
<!doctype HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>

<head>

<meta http-equiv=“Content-Type” content=“text/html; charset=windows-1252”>
<title>Enable/Disable Checkboxes</title>
<script type=“text/javascript”>
<!–
function chgCheckboxes(numbr)
{ var changeState=(numbr==1)? false : true;
for(var i=1;i<4; i++){ document.watching[“notify_”+i].disabled = changeState; }
}
//
//–>
</script>
<style type=“text/css”>
<!–
body { font-family:arial, helvetica, sans-serif; font-weight:bold; font-size:13px; color:#000; text-align:center; margin:3px 0px; }
form { width:300px; }
form p { margin-top:0px; margin-bottom:5px; }
fieldset { text-align:left; }
#wrap { position:relative; top:20px; left:0px; width:900px; height:500px; margin:0px auto; text-align:left; }
.m10 { margin-top:10px; }
–>
</style>
</head>

<body onload=“chgCheckboxes(2)”>

<div id=“wrap”>
<form name=“watching”>
<fieldset>
<legend>Checkboxes</legend>
<p class=“a”><input type=“checkbox” name=“notify_1” value=“BBB”> Notify 1<p>
<input type=“checkbox” name=“notify_2” value=“BBB”> Notify 2</p>
<p><input type=“checkbox” name=“notify_3” value=“BBB”> Notify 3</p>
</fieldset>
<p class=“m10”>
<input type=“radio” name=“eAlert” value=“1” onclick=“chgCheckboxes(1)”>
Email alerts</p>
<p>
<input type=“radio” name=“eAlert” value=“2” checked onclick=“chgCheckboxes(2)”>
No Email alerts</p>
</form>
<!-- end form –>
</div>
<!-- end wrap –>

</body>

</html>