window.location not working in IE

[mikewagan]

hello guys, Javascript's been bugging on IE, and i'm trying to search for a solution for this answer but no luck.

I have a select box as a navigation element. If a user clicks on an option, it will go to a separate page. This works well in Mozilla, but not in IE. heres my code:


[HTML]<form method="get" action="">
<select name="category" id="category">
<option value="Nature" onclick="window.location='index.php'; return true;">Nature</option>
<option value="Fine_Arts" selected="selected" onclick="window.location='finearts.php'; return true;">Fine Arts</option>
<option value="People" onclick="window.location='people.php'; return true;">People</option>
<option value="Places" onclick="window.location='places.php'; return true;">Places</option>
<option value="Fashion" onclick="window.location='fashion.php'; return true;">Fashion</option>
<option value="Street_Photography" onclick="window.location='streetphotography.php'; return true;">Street Photography</option>
<option value="Photojournalism" onclick="window.location='photojournalism.php'; return true;">Photo Journalism</option>
<option value="Photojournalism" onclick="window.location='gallery.php'; return true;">Gallery</option>

<option value="Photojournalism" onclick="window.location='specialevents.php'; return true;">Special Events</option>
<option value="Photojournalism" onclick="window.location='amateurphotography.php'; return true;">Amateur Photography</option>
<option value="Photojournalism" onclick="window.location='blackandwhite.php'; return true;">Black & White Photography</option>
</select>
</form>[/HTML]


Any help is appreciated!

[acoder]

Instead of an onclick for each option, add an onchange to the select object to call a function which takes the value and sets the location.href to that.

[mikewagan]

Instead of an onclick for each option, add an onchange to the select object to call a function which takes the value and sets the location.href to that.

here's what i did:

<option value="Fine_Arts" onchange="window.location='finearts.php'; return true;">Fine Arts</option>

instead of

<option value="Fine_Arts" onclick="window.location='finearts.php'; return true;">Fine Arts</option>

but did not fix the problem with IE.

[mrhoo]

IE expects the onchange to come from the select element, not the option.
The select elements value will be the selected option's value.

This works as well in firefox as listening to each option.
.

[acoder]

In code, that would be:

<select name="category" id="category" onchange="location.href=this.value;">
<option value="index.php">Nature</option>
<option value="finearts.php">Fine Arts</option>
<option value="people.php">People</option>

and so on.

[mikewagan]

In code, that would be:

<select name="category" id="category" onchange="location.href=this.value;">
<option value="index.php">Nature</option>
<option value="finearts.php">Fine Arts</option>
<option value="people.php">People</option>

and so on.

Thanks a lot man! It works for me!

[acoder]

You're welcome. Post again if you have any more questions.