Link Click Selects Dropdown List Item on Another Page

Hi all,

I have a page with some links. I’m trying to make it when the user clicks a link, they will be taken to another page that has a form, including a dropdown where the option is selected based on which link the user clicked.

Here’s the code I have so far where I have 5 links for 5 colors.

The first page with the links (clicklink.html):

<!-- The JavaScript. -->
<script type="text/javascript">
function SelectItem(list,item) {
var box = document.getElementById(list);
for(var i=0; i<box.length; i++) {
   if(box[i].value == item) {
  box[i].selected = true;

<!-- The links. -->
<a href="selectoption.html#javascript:SelectItem('example','black')">Black</a> |
<a href="selectoption.html#javascript:SelectItem('example','green')">Green</a> |
<a href="selectoption.html#javascript:SelectItem('example','red')">Red</a> |
<a href="selectoption.html#javascript:SelectItem('example','blue')">Blue</a> |
<a href="selectoption.html#javascript:SelectItem('example','white')">White</a>

The page with the form, including the dropdown (selectoption.html):

<!-- The select form field. -->
<select id="example">
<option value=""></option>
<option value="black">Black</option>
<option value="green">Green</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="white">White</option>

The code I have above does not currently select the dropdown option when any of the links are clicked.

I’d appreciate it if someone could please help me with this. Thanks!

  • Pam