PDA

View Full Version : two drop down lists


amidude
05-15-2003, 07:30 PM
I'm having difficulty using two drop down lists. I can't seem to get both of them to work. Here is my HTML so far:


<form name="game">
<select name="game_search" onChange="jumpTo(form);">
<option selected>Choose a Game
<option value="------------">- - - - - - -
<option value="game1.html">game 1
<option value="game2.html">game 2
<option value="game3.html">game 3
<option value="game4.html">game 4
<option value="game5.html">game 5
</select></form>
<br>
<form name="platform">
<select name="platform_search" onChange="jumpTo(form);">
<option selected>Choose a Platform
<option value="------------">- - - - - - -
<option value="ps2.html"> PS 2
<option value="ps.html">PlayStation
<option value="gamecube.html">GameCube
<option value="xbox.html">X-Box
<option value="all.html">All
</select>
</form>

How in the world do I get select the proper form so that it picks up the proper value selected for that particular form?

I'm not the greatest Javascript writing person on the planet so please don't laugh if this code sucks. Here's my javascript:

function jumpTo(form) {
if (form == "game"){
gpageindex=form.game_search.selectedIndex;
window.location=form.game_search.options[gpageindex].value;
}
else if (form == "platform"){
gpageindex=form.platform_search.selectedIndex;
window.location=form.platform_search.options[gpageindex].value;
}
}

Any help would greatly improve my understanding of Javascript syntax and would be greatly appreciated.

HairyTeeth
05-15-2003, 09:01 PM
Try this:

function jumpTo(fld){
var selectedFld = fld.options[fld.selectedIndex].value

if((selectedFld.indexOf("Choose")!= -1) || (selectedFld.indexOf("Spacer")!= -1)){
return false;
}else{
alert(selectedFld)
//location.href=selectedFld
}
return true
}


With some modification to theform like so:



<form name="game">
<select name="game_search" onChange="jumpTo(this);">
<option value="Choose" selected>Choose a Game
<option value="Spacer">- - - - - - -
<option value="game1.html">game 1
<option value="game2.html">game 2
<option value="game3.html">game 3
<option value="game4.html">game 4
<option value="game5.html">game 5
</select></form>
<br>
<form name="platform">
<select name="platform_search" onChange="jumpTo(this);">
<option value="Choose" selected>Choose a Platform
<option value="Spacer">- - - - - - -
<option value="ps2.html"> PS 2
<option value="ps.html">PlayStation
<option value="gamecube.html">GameCube
<option value="xbox.html">X-Box
<option value="all.html">All
</select>
</form>


In this instance, the this key word is a short way of saying

document.platform.platform_search


The first two select items in each form, if selected, return false so the user doesn't get an error when they select them.

amidude
05-15-2003, 09:07 PM
thanks...I'll give it a shot.

amidude
05-15-2003, 09:12 PM
That totally worked. Thank you so much.