Radio button to enable text box

[New Coder]

Hello All,

On my form I have 8 radio buttons one of which the value is "other" I have a text box next to "other" so that we can capture what the other might be. (Standard stuff I'm sure you've seen)

I have got it so that the text box is enabled if they select the "other" radio button, but it's not being disabled again if they decide to pick a different option and my limited javascript knowledge,I'm stuck.

Heres what I have so far:

<script type="text/javascript">
var currentEnabled = null;
function enableElement(elem)
{
if (currentEnabled)
{
	currentEnabled.disabled = true;
}
elem.disabled = false;
currentEnabled = elem;
}
</script>

 

list .= "<tr>";
$list .= "<td class=table width=\"50%\"><input type=\"radio\" class=\"radio_button\" name=\"destination\" value=\"1\">Spain</td>";	
$list .= "<td class=table width=\"50%\"><input type=\"radio\" class=\"radio_button\" name=\"destination\" value=\"2\">France</td>";
$list .= "</tr>";
$list .= "<tr>";
$list .= "<td class=table width=\"50%\"><input type=\"radio\" class=\"radio_button\" name=\"destination\" onclick=\"enableElement(this.form.elements['other_desc'])\" value=\"99\">Other</td>";	
$list .= "<td class=table width=\"50%\"><input type=\"text\" class=\"textdesc\" style=\"color:lightgrey\" size=\"50\" name=\"other_desc\" value=\"If other enter detail here\" disabled=\"disabled\" onfocus=\"if (this.className=='textdesc') { this.className = ''; this.value = '';this.style.color = 'black';}\"  onblur=\"if (this.value == '') { this.className = 'textdesc'; this.value = 'If other enter detail here'; this.style.color = 'lightgrey'; }\" ></td>";
$list .= "</tr>";

 

Above is only a snipit :-)

 

Any help much appreciated.

 

Many Thanks

[jug]

Hi,

 

You would need to put the on click function call on every radio button.

 

So..

 

<input type=\"radio\" class=\"radio_button\" name=\"destination\" value=\"1\" onclick=\"enableElement();\">Spain
<input type=\"radio\" class=\"radio_button\" name=\"destination\" value=\"2\" onclick=\"enableElement();\">France
<input type=\"radio\" class=\"radio_button\" name=\"destination\" value=\"3\" onclick=\"enableElement();\">Other

function enableElement ()
{
var radioValue = '';
var selection = document.getElementsByName('destination');

for (i=0; i<selection.length; i++)
{
	if (selection[i].checked)
	{
		radioValue = selection[i].value;
		break;
	}
}

if (radioValue == 'other')
{
	//enable text box
}
else
{
	//disable text box
}
}

 

I havent tested this code but hopefully it will help you on your way.

 

jug