Forums

I know variations on this have been answered elsewhere. What I have are two input fields, a drop down menu followed by a text box (which should start invisible). I would like the selection of "Other" in the drop down menu to make the subsequent text box visible. I realize Javascript will be necessary, both to toggle the text box on when "Other" is selected and to turn it off when subsequently unselected, and I have a good start, but I'm a bit new at this. Any help is appreciated.

FORM HTML

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 150px;">Color</label>
    <select class="cf_inputbox" id="select_5" size="1" title="" name="select_5">
       <option value="Red">Red</option>
       <option value="Green">Green</option>
       <option value="Blue">Blue</option>
       <option value="Other">Other</option>
    </select>
  </div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Enter New Color</label>
    <input class="cf_inputbox" maxlength="150" size="30" title="" id="text_21" name="text_2" type="text" />
  </div>
</div>

JS CODE

<script language="JavaScript">
   function toggleVisibility(me){
      if (me.style.visibility=="hidden"){
         me.style.visibility="visible";
      }
      else {
         me.style.visibility="hidden";
      }
   }
</script>

Hi hoffner5,

You'll need to add an onChange event to the drop down that checks the value and fires the ToggleMe function if the 'other' option is selected.

Bob