Click to See Complete Forum and Search --> : 2 Pulldown Menus on 1 Page...


weatherman2525
06-09-2003, 02:33 PM
Hi,

I am in need of 2 separate pulldowm menus on the same page, so that when you select an item from one of the menus it changes in the other frame, but I can't seem to get both to work. If one works the other doesn't. I do not know much of anything about JavaScript I normally just use the codes on this site. The frame it needs to change in is called "index1".

Please Help!
Adam

Here is the coding I got so far...

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title></title>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function leapto(form) {
var myindex=form1.select1.selectedIndex
parent.index1.location.href=(form.select1.options[myindex].value);
}
// End -->
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function leapto(form) {
var myindex=form2.select2.selectedIndex
parent.index1.location.href=(form.select2.options[myindex].value);
}
// End -->
</SCRIPT>
</head>

<body>

<center>
<FORM NAME="form1">
<SELECT NAME="select1" SIZE=1 onChange="leapto(this.form)">
<OPTION SELECTED VALUE="0"> ------ Peace Buddy ------>
<OPTION value="http://www.peacebearworld.com/galleries/peacebuddypage01.htm"> Page 1
<OPTION value="http://www.peacebearworld.com/galleries/peacebuddypage02.htm"> Page 2
<OPTION value="http://www.peacebearworld.com/galleries/peacebuddypage03.htm"> Page 3
</SELECT>
</FORM></center><p>

<center>
<FORM NAME="form2">
<SELECT NAME="select2" SIZE=1 onChange="leapto(this.form)">
<OPTION SELECTED VALUE="0"> ------ Peace Bears ------>
<OPTION value="http://www.peacebearworld.com/galleries/peace01page01.htm"> Page 1
<OPTION value="http://www.peacebearworld.com/galleries/peace01page02.htm"> Page 2
<OPTION value="http://www.peacebearworld.com/galleries/peace01page03.htm"> Page 3
</SELECT>
</FORM></center><p>

</html>

Khalid Ali
06-09-2003, 03:50 PM
You need to make 2 changes in the code.
1.replace both of your js function parts with the following code

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function leapto(url,frameName) {
parent.index1.location.href = url;
}
// End -->
</SCRIPT>

2. Part two make changes in the html of both select boxes..this line
<SELECT NAME="select1" SIZE=1 onChange="leapto(this.form)">

in each select box be replaced by this one

<SELECT NAME="select1" SIZE=1 onChange="leapto(this.options[this.selectedIndex].value)">

weatherman2525
06-09-2003, 04:22 PM
Thank you so much! I just changed what you said and they now they both work! :)

Thanks again and take care,
Adam

Khalid Ali
06-09-2003, 04:25 PM
sweet...

and you are welcome..:)