Hiding HTML Text Based on Drop Down Selection
Posted on 2004-11-10
I've seen lots of answers on this, but I can't seem to get this working.
I've got a form where I have red asterisks (*) symbolizing what is a required field. On that form, if the user selects a certain option from a drop down menu, some of those asterisks should go away as those fields are not required.
Here's what I have:
if (document.theform.txt_contracttype.options[document.theform.txt_contracttype.selectedIndex].value == 'Option 2')
document.theform.reqd.style.visibility = 'hidden';
And in my HTML, I have the following:
(the form in question is FORM NAME="theform" ID="theform" for reference)
<td width="47%" align="right">
<b><font face="Verdana, Arial, Helvetica, sans-serif" size="3" color="#FF0033">*</font></b>
<font size="2" face="Verdana, Arial, Helvetica, sans-serif"><b>Contract Type: </font></b>
<td width="53%<select name="txt_contracttype" OnChange="reqdshow;">
<option value=""> --- Please Select --- </option>
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
<option value="Option 3">Option 3</option>
So when "Option 2" is selected, I want to hide the asterisks I put in between the SPAN tags.
Does this make sense? I must be losing my mind on this or be making a really goofy mistake. Any help provided is GREATLY appreciated!