Drop-Down Menu Quirks

[Aes]

I'm using the following coding in the respective portions of a site.

Head:

<script language="javascript" type="text/javascript">
<!--
function formhandler(form)
{
	var URL=document.websites.sites.options[document.websites.sites.selectedIndex].value;
	window.location.href=URL;
}
//-->
</script>

Body:

<form name="websites" action="">
<select name="sites" size="1" onchange="javascript:formhandler()">
<option selected="selected">Sites:</option>
<option value="#">-------------------</option>
<option value="http://www.somesite.com/">Somesite</option>
</select>
</form>

When the second option is selected ("-------------------"), there's a JavaScript error and the form ceases to function until the page is reloaded.

I put the hash mark (#) in there to alleviate this problem, however it did not do the trick.

Any ideas as to how to keep the script functioning when the dashes are selected?

[Anarchos]

Try this:

<form>
<select size="1" onchange="formHandler(this)">
<option selected="selected">Sites:</option>
<option>-------------------</option>
<option value="http://www.somesite.com/">Somesite</option>
</select>
</form>
<script type="text/javascript">
<!--
function formHandler(selectObj)
{
     var url = selectObj.options[selectObj.selectedIndex].value;
     if (url != '') location.href = url;
}
//-->
</script>

[Aes]

Thanks much Anarchos. That works beautifully.

[Vincent Puglia]

You can also pass the value itself and cut the function to 1 line:

<select size="1" onchange="formHandler(this.options[this.selectedIndex].value)">
......
function formHandler(optVal)
{
if (optVal != '') location.href = optVal;
}

Vinny