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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Nov 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Update Jump Menu Based on Radio Button Selected

    I would like to update the link options in a jump menu based on the radio button that is selected. For example, if a radio button for NFL is selected the jumpmenu would list the NFL Team Names and would go to a specific team web site if selected. If a a radio button for MLB was selected, the jump menu would list MLB teams and so on.

    Can anyone help?

    Thanks
    Kris

  • #2
    New Coder
    Join Date
    Jan 2011
    Posts
    52
    Thanks
    0
    Thanked 9 Times in 9 Posts
    The described functionality could be provided by a linked-dropdown script, the second dropdown acting as the jump menu.

  • #3
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,146
    Thanks
    39
    Thanked 505 Times in 499 Posts

    Lightbulb

    Here is a start to what I believe you want. Modify to your <3's content.
    Adding the jump-links is easy when you provide the URLs associated with each team.
    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <title> Untitled </title>
    <style type="text/css">
    .league { display:none; }
    </style>
    <script type="text/javascript">
    function showLeague(info) {
      var sel = document.getElementById('leagues').getElementsByTagName('div');
      for (var i=0; i<sel.length; i++) { sel[i].style.display = 'none'; }
      document.getElementById(info).style.display = 'block';
    }
    </script>
    </head>
    <body>
    <input type="radio" name="leagues" value="AFC" onclick="showLeague(this.value)">AFC
    <input type="radio" name="leagues" value="NFC" onclick="showLeague(this.value)">NFC
    <input type="radio" name="leagues" value="MLB_AL" onclick="showLeague(this.value)">MLB - AL
    <input type="radio" name="leagues" value="MLB_NL" onclick="showLeague(this.value)">MLB - NL
    <div id="leagues">
     <div id="AFC" class="league">
      <select id="AFCteams">
       <option value=''> Choose AFC-East team </option>
       <option value='Miami Dolphins'> Miami Dolphins </option>
       <option value='Buffalo Bills'> Buffalo Bills </option>
       <option value='New England Patriots'> New England Patriots </option>
       <option value='New York Jets'> New York Jets </option>
      </select>
     </div>
     <div id="NFC" class="league">
      <select id="NFCteams">
       <option value=''> Chose NFC-East team </option>
       <option value='Dallas Cowboys'> Dallas Cowboys </option>
       <option value='New York Giants'> New York Giants </option>
       <option value='Washington Redskins'> Washington Redskins </option>
       <option value='Philadelphia Eagles'> Philadelphia Eagles </option>
      </select>
     </div>
     <div id="MLB_AL" class="league">
      <select id="ALEteams">
       <option value=''> Choose AL-East team </option>
       <option value='Tampa Bay Rays'> Tampa Bay Rays </option>
       <option value='Baltimore Oriels'> Baltimore Oriels </option>
       <option value='Boston Red Sox'> Boston Red Sox </option>
       <option value='New York Yankees'> New York Yankees </option>
       <option value='Toronto Blue Jays'> Toronto Blue Jays </option>
      </select>
     </div>
     <div id="MLB_NL" class="league">
      <select id="NLEteams">
       <option value=''> Choose NL-East team </option>
       <option value='Miami Marlins'> Miami Marlins </option>
       <option value='Atlanta Braves'> Atlanta Braves </option>
       <option value='New York Mets'> New York Mets </option>
       <option value='Philadelphia Phillies'> Philadelphia Phillies </option>
       <option value='Washington Nationals'> Washington Nationals </option>
      </select>
     </div>
    </div>
    </body>
    </html>


  •  

    LinkBacks (?)


    Posting Permissions

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