adding a second drop down list (Full Version)

All Forums >> [Web Development] >> Microsoft FrontPage Help



Message


jtm311 -> adding a second drop down list (10/23/2005 20:51:46)

Hello I was able to add one drop down list to my page but I would like to add a few others. But it keeps giving me an error stating the form is already used.

any help would be great. I'm using 2002 FP
Also these drop downs are used with out a "go" button and will only link you to onther page.

Thanks,
john




womble -> RE: adding a second drop down list (10/24/2005 4:26:01)

can you post a url so we can see what the problem is?

welcome to OF btw! [:)]




jtm311 -> RE: adding a second drop down list (10/24/2005 16:10:38)

Thanks for the welcome..

Ok this may help?

The below code is what I have added and works great, however, the problem I'm having is I would like two drop down lists and not sure how to make it work with two.

thanks for the help.
John

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function formHandler(form){
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
}
// End -->
</SCRIPT>

<center>
<form name="form">
<select name="site" size=1 onChange="javascript:formHandler()">
<option value="">Go to...

<!-- Option 1 -- To have the pull down menu go to your own pages, change the URL within the quotation marks and the link name. -->
<!-- Option 2 -- You may remove or add entire lines to increase or decrease the number of links. -->
<option value="http://www.yahoo.com">Yahoo
<option value="http://geocities.yahoo.com/">GeoCities
<option value="http://shopping.yahoo.com/">Yahoo! Shopping
<option value="http://travel.yahoo.com/">Yahoo! Travel

</select>
</form>
</center>





womble -> RE: adding a second drop down list (10/24/2005 16:19:53)

You want to add another dropdown to the same form, or another form on the same page?




jtm311 -> RE: adding a second drop down list (10/24/2005 16:29:10)

Yes sorry about that another to the same form.

here is my site and you can see on the left I made the first one now I would like to add the rest right under it. www.jtm311.com

John




womble -> RE: adding a second drop down list (10/24/2005 16:33:40)

The easiest way would be to add another form exactly the same directly under it, but with different urls.




jtm311 -> RE: adding a second drop down list (10/24/2005 16:40:57)

Thanks womble.

i thought it was that easy. This is where I start having problems. Do I add the whole srcip? If not what should I add?

Thanks,
John




womble -> RE: adding a second drop down list (10/24/2005 17:11:54)

You'll need to give the second form a different name and in the js for the second form, change the name in the script on this line:

function formHandler(form)


to whatever the name of the second form is.





jtm311 -> RE: adding a second drop down list (10/24/2005 17:49:18)

oK womble one step closer.. the second one shows up now.. but it does not change to the page list in the below? I added the below.

John


<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
c
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
}
// End -->
</SCRIPT>

<center>
<form name="formd2">
<select name="" size=1 onChange="javascript:formHandler()">
<option value="">Go to...

<!-- Option 1 -- To have the pull down menu go to your own pages, change the URL within the quotation marks and the link name. -->
<!-- Option 2 -- You may remove or add entire lines to increase or decrease the number of links. -->

<option value="http://www.yahoo.com">Yahoo

</select>
</form>
</center>




womble -> RE: adding a second drop down list (10/24/2005 17:57:35)

Your js needs to be the same as below, with the same name as the form's name in the 2nd line.
quote:

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function formHandler(formd2){
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
}
// End -->
</SCRIPT>

That should work.




jtm311 -> RE: adding a second drop down list (10/24/2005 18:32:29)

Did not see that extra d ,,lol but what it does now after fixing it. It only goes to whatever the last page I selected from the other drop down.

John




dpf -> RE: adding a second drop down list (10/24/2005 18:52:52)

quote:

You'll need to give the second form a different name and in the js for the second form, change the name in the script on this line:

function formHandler(form)


to whatever the name of the second form is.
that shouldnt be necessary. a function is designed to be used repeatedly - as often as it is "called". in this case, the function formHandler is "called" with this: onChange="javascript:formHandler()">

when the function was defined within the <script> tag, the author defined it as
quote:

function formHandler(form)
but the use of (form) could have just as easily been x since it merely represents whatever parameter is passed from the call. in other words, it could have (and maybe should have for reasons i will discuss) looked like this:
quote:

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function formHandler(x){
var URL = document.form.site.options[document.x.site.selectedIndex].value;
window.location.href = URL;
}
// End -->
</SCRIPT>


what happens is that the call passes the form values a a parameter. the x respersents whatever is passed.

is thatmaking any sense? the point is that the script function only needs to be defined one time - not for each time it is used.




womble -> RE: adding a second drop down list (10/24/2005 18:59:04)

[img]http://www.ecanus.net/forumsmiles/duh.gif[/img]
/hasn't put brain into gear yet
Lucky you showed up pdf! [;)]




jtm311 -> RE: adding a second drop down list (10/24/2005 19:24:35)

Thanks I'm understanding that the srcip only need to be done once then how does it know to go to what form?

Hope it is ok I'm pasting the whole part as it is in my code mabye you can change it to work correctly??? then I can see what you are doing[:D]

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function formHandler(form){
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
}
// End -->
</SCRIPT>

<center>
<p></p>
<form name="form">
Build photos:<p>
<select name="site" size=1 onChange="javascript:formHandler()">
<option value="">Build photos...


<option value="http://www.jtm311.com/new_page_13.htm">Build Aug_Oct 05
<option value="http://www.jtm311.com/new_page_12.htm">Starting the Motor
<option value="http://www.jtm311.com/new_page_7.htm">Build April_June 05
<option value="http://www.jtm311.com/new_page_6.htm">Build March_April 05
<option value="http://www.jtm311.com/new_page_4.htm">Build Jan_March 05
<option value="http://www.jtm311.com/new_page_3.htm">Build Jan_Feb 05
<option value="http://www.jtm311.com/new_page_1.htm">Build Nov 04_Jan 05
<option value="http://www.jtm311.com/new_page_2.htm">Project Start Nov 05
</p>
</form>
</center>

</td>

<td nowrap width="441" align="center" height="49">
<p style="margin-top: -8"><i><b>
<font color="#0000FF" face="TimesRoman" size="+3"><span style="font-size:30">
 </span></font><font color="#0000FF" face="TimesRoman" size="5"> </font>
<font color="#0000FF" face="TimesRoman" size="6">My 1999 Diablo Roadster
Build.</font></b></i></td>
<td width="95" bordercolor="#000000" height="49">
<p style="margin-top: 0" align="left"><u><i><b>
<font color="#FFFFFF" face="TimesRoman" size="+1"><span style="font-size:18">
My Info:</span></font></b></i></u><font color="#FFFFFF">    
</font> <a href="http://edit.yahoo.com/config/send_webmesg?.target=fzsjtm311&.src=pg">
<font color="#FFFFFF"><img border=0 src="http://opi.yahoo.com/online?u=fzsjtm311&m=g&t=1"></font></a></p>
<p style="margin-top: -17" align="left"><font color="#FFFFFF"> </font><b><font color="#FFFFFF" size="-1"><span style="font-size:12">Name: 
John </span></font></b>
</p>
</td>
</tr>
<tr>
<td valign="top" width="467" align="center" height="1">
<p><i><b><font color="#0000FF" size="5"> Last updated on </font>
<font color="#FFFFFF" size="5">
<u>10/23/05</u></font></b></i></p>
<p><font color="#FFFF00" face="TimesRoman"><span style="font-size:14">
This site will take you through the build progress of my replica 1999 
Diablo Roadster from the ground up. I'm using a "North American Exotic
Replica Cars Inc." (NAERC) kit to build my car. I will build a custom tube
frame powered by a LS1 Corvette Engine and a Porsche 915 Transaxle.</span></font></p>
<p align="center"> </p>
<p align="left" style="margin-top: -28"><font color="#FFFF00" size="5"><b><i>
Current progress...</i></b></font></p>
</td>
<td valign="top" width="250" bordercolor="#000000" style="color: #0000FF; word-spacing:0; line-height:100%" height="1" align="center">
<p style="margin-top: 0" align="left">
<b><i><font face="TimesRoman" size="2" color="#FFFFFF">NAERC car</font></i></b></p>
<p style="margin-top: -15" align="left">
<b><i><font face="TimesRoman" size="2" color="#FFFFFF">This is what the 
end result should look like!</font></i></b></p>
<p style="margin-top: 5"><a href="http://www.naerc.com">
<font color="#FFFFFF">
<img border="1" src="Lambo.jpg" width="205" height="159" align="left"></font></a></td>
</tr>
<tr>
<td width="137" height="383" rowspan="2" valign="top" align="left">
<p></p>
<p></p>
<p>
<p>
</p>
<p style="line-height: 150%; margin-top:-16"> 

<center>
<form name="form2">
<select name="" size=1 onChange="javascript:formHandler()">
<option value="">Go to...

<option value="http://www.yahoo.com">Yahoo

</select>
</form>
</center>

</p>
</td>




jtm311 -> RE: adding a second drop down list (10/25/2005 19:16:31)

Ok guys don't give up on me now we are to close to making it work???

John




dpf -> RE: adding a second drop down list (10/26/2005 8:01:50)

i tested that and it worked for me




jtm311 -> RE: adding a second drop down list (10/26/2005 10:44:34)

It is the second drop down that does not work... But I received an email back from Java they said the problem is I need a statment for each time it is called. They gave me the following fix, I will try it tonight
Thanks for the help

John


<html>
<head>
function formHandler1(){
var URL = document.form1.site1.options[document.form1.site1.selectedIndex].value;
window.location.href = URL;
}
function formHandler2(){
var URL = document.form2.site2.options[document.form2.site2.selectedIndex].value;
window.location.href = URL;
}

</SCRIPT>
</head>





dpf -> RE: adding a second drop down list (10/26/2005 11:14:03)

i guess i was wrong




jtm311 -> RE: adding a second drop down list (10/26/2005 13:41:07)

Thank Dan not sure yet thanks for the help...

John




jtm311 -> RE: adding a second drop down list (10/27/2005 19:41:21)

Hello just wanted to follow-up I got it to work using the following.

Just thought you would like to know.

here is what it looks like.

thanks again,
John

<!-- Begin
function formHandler1(){
var URL = document.form.site1.options[document.form.site1.selectedIndex].value;
window.location.href = URL;
}
function formHandler2(){
var URL = document.form.site2.options[document.form.site2.selectedIndex].value;
window.location.href = URL;
}
function formHandler3(){
var URL = document.form.site3.options[document.form.site3.selectedIndex].value;
window.location.href = URL;
}
function formHandler4(){
var URL = document.form.site4.options[document.form.site4.selectedIndex].value;
window.location.href = URL;
}
// End -->
</SCRIPT>





Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.109375