javascript dropdown menu onclick

I’ve been working at this for a while now, but don’t understand what’s wrong with my code. I’m sure it’s something simple – it always is!

Basically, I have a drop down menu, with some options. I want it to go to a web page when the third option, plumber, is selected. When any of the others are clicked, nothing should happen.

My code so far is:

<select id = 'search'>
<option value="1">Carpenter</option>
<option value="2">Electrician</option>
<option value="3">Plumber</option>
<option value="4">Tiler</option>
<option value="5">Boiler Installation</option>

</select>

Go

And my javascript is:

<script>
function go_button {
if (search.value=="3") {
location="search_results.htm"
}
}

</script>​​​​​​​

But it’s not working. Could someone tell me what’s wrong?

Thanks.

C.

Answer

You can either put a change event on your control via script or add it directly to your control..

Direct Method:

<select id="search" onChange="OnSelectedIndexChange()">

This is the function you need to put in your Script:

//function for changed selection
function OnSelectedIndexChange()
{
if (document.getElementById('search').value == "3"){
    location.href="search_results.htm";
}
}

Add Change event using Script (either JavaScript or JQuery):

I suggest JQuery for doing so (the onSelectedIndexChange function is obsolete here)

$('#search').change( function() {

if(this.val() == "3"){
location.href="search_results.htm";
}

});

If you don’t want to use JQuery just add the following code:

    var yourdropdown = document.getElementById('search');
    yourdropdown.Attributes.Add("onChange", "return OnSelectedIndexChange();")