Hiding a drop down menu

Here is my code:

<html>

<head>
<title>Add/Delete A CD</title>
<script>
function setMenu(Menu) {
      switch (Menu) {
            case 1: {
                  document.add.SpecCat.options[0].value="Pop/Rock";
                  document.add.SpecCat.options[1].value="Pop";
                  document.add.SpecCat.options[2].value="Rock";
                  document.add.SpecCat.options[3].value="Ska";
                  document.add.SpecCat.options[4].value="";
                  document.add.SpecCat.options[5].value="";
                  document.add.SpecCat.options[0].selected=true;
                  document.add.Genre[0].checked=true;
                  break;
            }
            case 2: {
                  document.add.SpecCat.options[0].value="Dance";
                  document.add.SpecCat.options[1].value="Drum and Bass";
                  document.add.SpecCat.options[2].value="House";
                  document.add.SpecCat.options[3].value="Techno";
                  document.add.SpecCat.options[4].value="Trance";
                  document.add.SpecCat.options[5].value="Other";
                  document.add.SpecCat.options[0].selected=true;
                  document.add.Genre[1].checked=true;
                  break;
            }
            case 3: {
                  
            }
      }
      setOptionText();
}

function setOptionText() {
      document.add.SpecCat.options[0].text=document.add.SpecCat.options[0].value;
      document.add.SpecCat.options[1].text=document.add.SpecCat.options[1].value;
      document.add.SpecCat.options[2].text=document.add.SpecCat.options[2].value;
      document.add.SpecCat.options[3].text=document.add.SpecCat.options[3].value;
      document.add.SpecCat.options[4].text=document.add.SpecCat.options[4].value;
      document.add.SpecCat.options[5].text=document.add.SpecCat.options[5].value;
}
</script>
</head>

<body onLoad="setMenu(1); document.add.Genre[0].checked=true">

<h1>Add/Delete a CD</h1><br><br>
To add a CD, fill out the form and click Submit.  For deleting CD's, click <a href="delete.html">HERE</a><br><br>
<form name="add" action="/myapp/IT202Assignment10/add.jsp" method="post" onReset="setMenu(1)">
<table name=add cols=3>
<tr>
      <td>CD Number:</td>
      <td><input type=text name=CDNum></td>
      <td> </td>
</tr>
<tr>
      <td>Artist:</td>
      <td><input type=text name=Artist></td>
      <td> </td>
</tr>
<tr>
      <td>Title:</td>
      <td><input type=text name=Title></td>
      <td> </td>
</tr>
<tr>
      <td>Genre:</td>
      <td><input type=radio name=Genre value=Pop/Rock onClick="setMenu(1)" selected>Pop/Rock</td>
      <td>Specific Category: <select name="SpecCat">
                                          <option value="Pop/Rock">
                                          <option value="Pop">
                                          <option value="Rock">
                                          <option value="Ska">
                                          <option value="">
                                          <option value="">
                                       </select></td>
</tr>
<tr>
      <td> </td>
      <td><input type=radio name=Genre value=Electronic onClick="setMenu(2)">Electronic</td>
      <td> </td>
</tr>
<tr>
      <td> </td>
      <td><input type=radio name=Genre value=Soundtrack onClick="setMenu(3)">Soundtrack</td>
      <td> </td>
</tr>
<tr>
      <td> </td>
      <td><input type=radio name=Genre value=Mix onClick="setMenu(3)">Mix</td>
      <td> </td>
</tr>
<tr>
      <td> </td>
      <td><input type=radio name=Genre value=Rap onClick="setMenu(3)">Rap</td>
      <td> </td>
</tr>
<tr>
      <td> </td>
      <td><input type=radio name=Genre value=Other onClick="setMenu(3)">Other - <input type=text name=otherGenre></td>
      <td> </td>
</tr>
<tr>
      <td>Year:</td>
      <td><input type=text name=Year></td>
      <td> </td>
</tr>
<tr>
      <td><input type=submit value="Submit"></td>
      <td><input type=reset value="Clear Form"></td>
      <td> </td>
</tr>
</table>
</form>

</body>

</html>


I have a different values for the drop down menu show depending on what radio button is selected.  My problem is I want to hide the drop down menu if you select any radio button but the first two. So in the setMenu function, under case 3, can I put something there to do this?
nitrusoxideAsked:
Who is Participating?
 
COBOLdinosaurConnect With a Mentor Commented:
wrap a div around it:

<td><div id="layr">Specific Category: <select name="SpecCat">
                                   <option value="Pop/Rock">
                                   <option value="Pop">
                                   <option value="Rock">
                                   <option value="Ska">
                                   <option value="">
                                   <option value="">
                                 </select></div></td>

Then you can hide the layer with

document.getElementById('layr').style.visibility='hidden';

when you want to show it again ue:

document.getElementById('layr').style.visibility='visible';

Cd&
0
 
nitrusoxideAuthor Commented:
Thanks a lot, that's been bugging me for a while
0
 
COBOLdinosaurCommented:
Glad I could help.  Thanks for the A. :^)

Cd&
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.