Need to hide a form field (test) based on a previous field (select)

[jej1216]

I have a form in which a select field lists 5 items pus the option of "Other." I want a text field to be hidden unless the select field value is "Other."

The form is HTML, but I am assuming that I need to accomplish this with Javascript. Sample HTML code follows for the select field and the following text field.

<td>Location:<br><select name="room_descr" size="1">
<option value="">Select a Location</option>
<option value="Patient Room">Patient Room</option>
<option value="Therapy Gym">Therapy Gym</option>
<option value="Cafeteria">Cafeteria</option>
<option value="Hospital Grounds">Hospital Grounds</option>
<option value="Hospital Contractor Site">Hospital Contractor Site</option>
<option value="Other">Other</option>
</select></td>
<td>Other:<br><INPUT TYPE=TEXT NAME="oth_descr" SIZE=32 MAXLENGTH=25></td>
 

I'm pretty new to HTML and to Javascript. I'd appreciate either an answer from this forum or some links to samples/reference books.

Thanks,

jej1216

[epots9]

I have a form in which a select field lists 5 items pus the option of "Other." I want a text field to be hidden unless the select field value is "Other."

The form is HTML, but I am assuming that I need to accomplish this with Javascript. Sample HTML code follows for the select field and the following text field.

<td>Location:<br><select name="room_descr" size="1">
<option value="">Select a Location</option>
<option value="Patient Room">Patient Room</option>
<option value="Therapy Gym">Therapy Gym</option>
<option value="Cafeteria">Cafeteria</option>
<option value="Hospital Grounds">Hospital Grounds</option>
<option value="Hospital Contractor Site">Hospital Contractor Site</option>
<option value="Other">Other</option>
</select></td>
<td>Other:<br><INPUT TYPE=TEXT NAME="oth_descr" SIZE=32 MAXLENGTH=25></td>
 

I'm pretty new to HTML and to Javascript. I'd appreciate either an answer from this forum or some links to samples/reference books.

Thanks,

jej1216

[html]
<td>Other:<br><INPUT TYPE=TEXT NAME="oth_descr" SIZE=32 MAXLENGTH=25 disabled>
[/html]
and in your javascript

document.oth_descr.disabled = false
 

if its in a form then

document.myForm.oth_descr.disabled = false
 

thats should do the trick

[jej1216]

[html]
<td>Other:<br><INPUT TYPE=TEXT NAME="oth_descr" SIZE=32 MAXLENGTH=25 disabled>
[/html]
and in your javascript

document.oth_descr.disabled = false
 

if its in a form then

document.myForm.oth_descr.disabled = false
 

thats should do the trick

Thanks, epots9 - I understand where you set the text field to disabled and then override that with Javascript. Where do I put the Javascript? It needs to be following the "Other" option in the previous field, right?

I tried this but got errors:

<td>Location:<br><select name="room_descr" size="1">
<option value="">Select a Location</option>
<option value="Patient Room">Patient Room</option>
<option value="Therapy Gym">Therapy Gym</option>
<option value="Cafeteria">Cafeteria</option>
<option value="Hospital Grounds">Hospital Grounds</option>
<option value="Hospital Contractor Site">Hospital Contractor Site</option>
<option value="Other">Other (Describe)
<script language="JavaScript">
    document.irform.oth_descr.disabled = false;
</script></option>
</select></td>
<td>Other:<br><INPUT TYPE=TEXT NAME="oth_descr" SIZE=32 MAXLENGTH=25 disabled></td>
 

The form name is irform.

Thanks,
jej1216

[epots9]

put the javascript in the header

<script type="text/javascript">
function whatever()
{
//if option other is selected, enable textbox code
}
</script>

in the <select> tag add the attribute: [html]onchange="whatever();"[/html]