Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Rich Zimmerman
Rich Zimmerman
24,063 Points
Posted by Rich Zimmerman
Rich Zimmerman
24,063 Points

JavaScript drop down menu selection value

I've got a drop down menu selection and I'm trying to create a variable with the selection value to then be used in a link. for example: you select "bob" from the drop down, go to page2.html?name=bob

I want to then be able to have the value "bob" in a variable to be used in a link like "www.bob.com"

I've been trying getElementById().value and other things but the variable keeps coming up as undefined... I'm not sure if i'm over complicating this in my head or what but i'm stuck.

Thanks in advance.

Taylor Boudreau
Taylor Boudreau
7,285 Points
Taylor Boudreau
Taylor Boudreau
7,285 Points

Hi Richard,

What you're doing mostly sounds right, but posting your code for your selection menu would definitely help in troubleshooting this. One thing to possibly check is to be sure you've added a value param to your options in the select menu for each option.

Taylor

2 Answers

Rich Zimmerman
Rich Zimmerman
24,063 Points
Rich Zimmerman
Rich Zimmerman
24,063 Points 
<form  action="ibdockClerk.html">    <!-- Here's the form itself, created from an array in functions.js -->
    <select name="fc_name" id="fc_select">
      <option>Select FC</option>
        <script>
          for (i=0; i < fcLocations.length; i++) {
            document.write("<option value=" + fcLocations[i] + ">" + fcLocations[i] + "</option>");
          }    
        </script>
    </select>
    <input type="submit" value="Submit">
</form>

And then over on ibdockClerk.html is a bunch of links that the location name would need to be dynamically changed within the url based on the location selected. -This is 1 link example

<li><a id="fc_console" href="">FC Console</a></li>
<script>
  var fc = document.getElementById("fc_select").value;   <!--- This is the variable the keeps coming up undefined, I've tried setting it in this html file, in functions.js and even the initial index.html but it's still giving me problems  -->

  document.getElementById("fc_console").href = "https://"+ fc + "-linkexample.com";
</script>
Rich Zimmerman
Rich Zimmerman
24,063 Points
Rich Zimmerman
Rich Zimmerman
24,063 Points

I believe my issue is that when i select an FC, it then goes to another html page and resets the variable fc to null.