Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7

Thread: pull down menu

  1. #1
    Registered User
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    pull down menu

    how do i create a doc allowing the user to select his/her birth month from a pull-down list and from that display some type of output that would allow me to display the birthstone and meaning of it. this is all i have so far
    for example i want someone to be able to select may and get the out put of the word peral and it's meaning such as peace


    <html>
    <title>Pull-Down List</title>
    </head>
    <body>
    Select your birth month:
    <select name="birthstone">
    <option value="jan" selected>January</option>
    <option value="feb">February</option>
    <option value="mar">March</option>
    <option value="april">April</option>
    <option value="may">May</option>
    <option value="june">June</option>
    <option value="july">July</option>
    <option value="aug">August</option>
    <option value="sep">September</option>
    <option value="oct">October</option>
    <option value="nov">November</option>
    <option value="dec">December</option>
    </select>

    </body>
    </html>
    Last edited by flouriet; 10-16-2008 at 04:34 PM.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,314
    Thanks
    203
    Thanked 2,565 Times in 2,543 Posts
    This may help you:-

    http://www.codingforums.com/showthread.php?t=137818


    Quizmaster: What was the date of the Battle of Hastings?
    Contestant: Was it 1974?

  • Users who have thanked Philip M for this post:

    flouriet (10-17-2008)

  • #3
    Registered User
    Join Date
    Oct 2008
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts
    thank you it helped alot

  • #4
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,148
    Thanks
    39
    Thanked 506 Times in 500 Posts

    Lightbulb Something else to study on ...

    Another version (just playing around):
    PHP Code:
    <html>
    <
    title>Pull-Down List</title>
    <
    script type="text/javascript">
    // From: http://www.codingforums.com/showthread.php?t=150326
    function Show(info) {
      
    document.getElementById('Birthstone').innerHTML info;
    }
    </script>
    </head>
    <body>
    Select your birth month:
    <select name="birthstone">
    <option value="" onclick="Show(this.value)"></option>
    <option value="Garnet or Rose Quartz" onclick="Show(this.value)">January</option>
    <option value="Amethyst or Onyn" onclick="Show(this.value)">February</option>
    <option value="Aquamarine or Bloodstone" onclick="Show(this.value)">March</option>
    <option value="Diamond or Quartz" onclick="Show(this.value)">April</option>
    <option value="Emerald or Chrysoprase" onclick="Show(this.value)">May</option>
    <option value="Alexandrite or Monstone or Pearl" onclick="Show(this.value)">June</option>
    <option value="Ruby or Carnelion" onclick="Show(this.value)">July</option>
    <option value="Peridot or Sardonyx" onclick="Show(this.value)">August</option>
    <option value="Sapphire or Lapis" onclick="Show(this.value)">September</option>
    <option value="Opal or Tourmaline" onclick="Show(this.value)">October</option>
    <option value="Topaz or Citrine" onclick="Show(this.value)">November</option>
    <option value="Tanzanite or Zircon or Tourquoise" onclick="Show(this.value)">December</option>
    </select>
    <p>
    <div id="Birthstone" style="font-size:60px;color:red"></div>
    </body>
    </html> 
    Could set up display to come from array of 'stones & meanings' instead of the value of the option.
    Would be a fairly easy mod but I don't know the 'meanings' of the stones to give an example.
    Last edited by jmrker; 10-18-2008 at 06:04 AM.

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,314
    Thanks
    203
    Thanked 2,565 Times in 2,543 Posts
    Here is a version which actually works:-

    Code:
    <html> 
    <head>
    <script type="text/javascript"> 
    function Show() { 
    var pick = document.myform.bstone.value;
    document.getElementById('Birthstone').innerHTML = pick; 
    } 
    </script> 
    </head> 
    <body> 
    
    <form name = "myform">
    Select your birth month: 
    <select name="bstone"> 
    <option value="" ></option> 
    <option value="Garnet or Rose Quartz" >January</option> 
    <option value="Amethyst or Onyx" >February</option> 
    <option value="Aquamarine or Bloodstone" >March</option> 
    <option value="Diamond or Quartz" >April</option> 
    <option value="Emerald or Chrysoprase" >May</option> 
    <option value="Alexandrite or Moonstone or Pearl" >June</option> 
    <option value="Ruby or Carnelion" >July</option> 
    <option value="Peridot or Sardonyx" >August</option> 
    <option value="Sapphire or Lapis" >September</option> 
    <option value="Opal or Tourmaline" >October</option> 
    <option value="Topaz or Citrine" >November</option> 
    <option value="Tanzanite or Zircon or Tourquoise" >December</option> 
    </select> 
    
    <input type = "button" value ="Show Birthstone" onclick = "Show()">
    </form>
    <br><br>
    <div id="Birthstone" style="font-size:24px;color:red"></div> 
    </body> 
    </html>

    I have nothing but confidence in you. And very little of that.
    Groucho Marx (1890 - 1977)
    Last edited by Philip M; 10-18-2008 at 09:30 AM. Reason: Typo

  • #6
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,148
    Thanks
    39
    Thanked 506 Times in 500 Posts

    Question Huh ...

    Quote Originally Posted by Philip M View Post
    Here is a version which actually works:-
    I'm not sure I understand ... what didn't work for YOU?

    Ah ha! ... Just another reason to hate IE
    Last edited by jmrker; 10-18-2008 at 06:57 PM. Reason: Found problem indicated by prior poster

  • #7
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,148
    Thanks
    39
    Thanked 506 Times in 500 Posts

    Smile

    OK, this version appears to work with BOTH FF and IE.
    It also contains two versions (with and without button display)
    and it use DOM or 'getElementById' statements.
    PHP Code:
    <html
    <
    head>
    <
    script type="text/javascript"
    // From: http://www.codingforums.com/showthread.php?t=150326

    var Descriptions = [
      
    "",
      
    "January<br>Garnet or Rose Quartz<br>Description 1",
      
    "February<br>Amethyst or Onyx<br>Description 2",
      
    "March<br>Aquamarine or Bloodstone<br>Description 3",
      
    "April<br>Diamond or Quartz<br>Description 4",
      
    "May<br>Emerald or Chrysoprase<br>Description 5",
      
    "June<br>Alexandrite or Monstone or Pearl<br>Description 6",
      
    "July<br>Ruby or Carnelion<br>Description 7",
      
    "August<br>Peridot or Sardonyx<br>Description 8",
      
    "September<br>Sapphire or Lapis<br>Description 9",
      
    "October<br>Opal or Tourmaline<br>Description 10",
      
    "November<br>Topaz or Citrine<br>Description 11",
      
    "December<br>Tanzanite or Zircon or Tourquoise<br>Description 12"
    ];

    function 
    ShowDescription() {
      var 
    indx document.getElementById('pickBirthMonth').selectedIndex;
    //  var indx = document.myform.bstone.selectedIndex;
      
    document.getElementById('Birthstone').innerHTML Descriptions[indx];
    }
    </script> 
    </head> 
    <body> 

    <form name = "myform">
    Select your birth month: 
    <!-- select id="pickBirthMonth" name="bstone" --> <!-- use with button below --> 
    <select id="pickBirthMonth" name="bstone" onchange="ShowDescription()"> <!-- use without button below -->
     <option value=""></option>
     <option value="Jan">January</option>
     <option value="Feb">February</option>
     <option value="Mar">March</option>
     <option value="Apr">April</option>
     <option value="May">May</option>
     <option value="Jun">June</option>
     <option value="Jul">July</option>
     <option value="Aug">August</option>
     <option value="Sep">September</option>
     <option value="Oct">October</option>
     <option value="Nov">November</option>
     <option value="Dec">December</option>
    </select> 

    <!--
    <input type = "button" value ="Show Birthstone" onclick = "ShowDescription()">
    -->
    </form>
    <br><br>
    <div id="Birthstone" style="font-size:60px;color:red"></div> 
    </body> 
    </html> 


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •