Solved

Hiding a drop down menu

Posted on 2004-04-24
3
315 Views
Last Modified: 2010-04-06
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?
0
Comment
Question by:nitrusoxide
  • 2
3 Comments
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 125 total points
Comment Utility
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
 

Author Comment

by:nitrusoxide
Comment Utility
Thanks a lot, that's been bugging me for a while
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
Comment Utility
Glad I could help.  Thanks for the A. :^)

Cd&
0

Featured Post

6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

Join & Write a Comment

Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now