Disabling a radio button using another form control

**AWilliams** · Aug 13, 2003 13:36

I should start off by saying I haven't written a line of Javascript in my entire life, so apologies if my question seems a bit "newbie"ish.

I have a form which currently consists of two radio button fields. See the code below for what I mean:

Code:

<form action="article.php" name="cpform" method="post">
	<!-- field 1 -->
	<input type="radio" name="confirm" id="rb_1_confirm" value="1" tabindex="1" checked="checked" />Un-validate
	<input type="radio" name="confirm" id="rb_0_confirm" value="0" tabindex="2" />Permenantly Delete
	<br />
	<!-- field 2 -->
	<input type="radio" name="keepcomments" id="rb_1_keepcomments" value="1" tabindex="3" checked="checked" />Keep Comments
	<input type="radio" name="keepcomments" id="rb_0_keepcomments" value="0" tabindex="4" />Remove all Comments
</form>

What I'm looking to do is to disable second set of radio buttons ("keepcomments") if the user selects the "Permenantly Delete" option in the top set of radio buttons.

I'm fairly sure that this is a simple thing to do, but I simply haven't a clue on how to go about doing this. Could anyone give me some pointers?

**vgarcia** · Aug 13, 2003 13:42

HTML Code:

<form action="article.php" name="cpform" method="post">  
<!-- field 1 -->  
<input type="radio" name="confirm" id="rb_1_confirm" 
value="1" tabindex="1" checked="checked" 
/>Un-validate 
<input type="radio" name="confirm" id="rb_0_confirm"
 value="0" tabindex="2" onchange="setKeep(this.checked)" />Permenantly Delete 
<br />  
<!-- field 2 -->  
<input type="radio" name="keepcomments" 
id="rb_1_keepcomments" value="1" tabindex="3" 
checked="checked" />Keep Comments 
<input type="radio" name="keepcomments" 
id="rb_0_keepcomments" value="0" tabindex="4" 
/>Remove all Comments 
</form>

Code:

function setKeep(checkVar) {
 document.forms["cpform"].keepcomments[0].disabled = checkVar;
 document.forms["cpform"].keepcomments[1].disabled = checkVar;
}

**beetle** · Aug 13, 2003 13:56

Vinnie -- have I taught you nothing![img]images/smilies/tongue.gif[/img] Use references and don't hardcode functions (or do so as little as possible)!

Code:

function setKeep( elem, groupName )
{
	var group	= elem.form.elements[groupName],
		bool	= elem.checked,
		i	= 0,
		rb;
	while( rb = group[i++] )
	{
		rb.disabled = bool;
	}
}

Code:

onchange="setKeep(this,'keepcoments');"

[img]images/smilies/biggrin.gif[/img]

**AWilliams** · Aug 13, 2003 14:21

That works great, but when I change the option back to "Un-validated", the second set of radio buttons stay disabled whereas I would prefer them to be "re-enabled".

Also, would it be possible that along with disabling the second set of radio buttons, the value was changed so show that "Remove All Comments" was selected, just to reinforce to the user that comments will be deleted?

Thanks to both of you for your help [img]images/smilies/smile.gif[/img]

**Vincent Puglia** · Aug 14, 2003 06:24

Hi,

Is this what you want?

Code:

function setKeep( elem, groupName, bool )
{
 var group = elem.form.elements[groupName],
  i = 0,
  rb;
 while( rb = group[i++] )
 {
  rb.checked = !(bool == rb.value)
  rb.disabled = bool;
 }
}//-->
</script>
</head>
<body>
<form action="article.php" name="cpform" method="post">  
<-- field 1 -->  
<input type="radio" name="confirm" id="rb_1_confirm" 
value="1" tabindex="1" checked="checked" onchange="setKeep(this,'keepcomments',0)" 
/>Un-validate 
<input type="radio" name="confirm" id="rb_0_confirm"
 value="0" tabindex="2" onchange="setKeep(this,'keepcomments',1)" />Permenantly Delete

Vinny

**AWilliams** · Aug 15, 2003 05:21

Perfect! Thanks very much

**vgarcia** · Aug 15, 2003 06:54

Originally Posted by beetle

Vinnie -- have I taught you nothing![img]images/smilies/tongue.gif[/img] Use references and don't hardcode functions (or do so as little as possible)!

Got me again

User Tag List

Thread: Disabling a radio button using another form control

Thread Tools

Display

Disabling a radio button using another form control

Bookmarks

Bookmarks

Posting Permissions