Solved

Drop down list for navigation in FrontPage 98

Posted on 1998-06-06
11
199 Views
Last Modified: 2010-04-09
I want to have a drop down menu on an HTML page similar to a form, except it will allow a viewer to navigate to another page on my site, according to the selection.  I am using FrontPage98 and have tried unsuccessfully to do this with the Script Wizard.  An example of what I want is on the top of http://www.golf.com/
0
Comment
Question by:dpate
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
  • 3
  • +1
11 Comments
 
LVL 5

Accepted Solution

by:
Christian_Wenz earned 100 total points
ID: 1844127
I don't know FrontPage good enough, but here's how it's generally done

a) give each option in the pulldown list a value: the URL where you want this selection to point to.
In the source code view, each option should now read like this:
<OPTION NAME="Microsoft" VALUE="http://www.microsoft.com">
b1) set the NAME attribute of your form to "MyForm"
b2) set the NAME attribute of your select list in your form to "MySelect"

c) go to the view source view and enter the following in the <HEAD> section of your page:

<SCRIPT LANGUAGE="JavaScript"><!--
function gothere(){
  var selIdx = document.MyForm.MySelect.selectedIndex
  location.href = document.MyForm.MySelect.topions[selidx].value
}
//--> </SCRIPT>

d) now set the onChange attribute of your select list to "gothere()"

Hope this helps. If you need more info on that, please leave me a comment here.

  -Christian
0
 

Author Comment

by:dpate
ID: 1844128
Additional info for Christian Wenz:

I think i'm almost there.  I've done everything you've suggested but when I uploaded my page with the menu on it to the server and tried to select a menu item, it makes the browser go to a page named "gothere" (http://www.webgrafxinc.com/acdispensing/gothere()), instead of the page I want.  The actual URL of the page with my menu on it is:

http://www.webgrafxinc.com/acdispensing/menu.htm

The actual source code for the page is as follows:

<html>

<head><script LANGUAGE="JavaScript" FOR="window" EVENT="onfocus()">
<!--
Window.location.href = "gothere"

//-->
    </script>

<title>New Page 1</title>
<script LANGUAGE="JavaScript">
<!--
function gothere(){
var selIdx = document.MyForm.MySelect.selectedIndex
location.href = document.MyForm.MySelect.topions[selidx].value
}
//-->
    </script>

<meta name="Microsoft Theme" content="technolo 111, default">
<meta name="Microsoft Border" content="tlb, default">
</head>

<body>

<p>&nbsp;</p>

<p><a href="map.htm">ert</a></p>

<p>&nbsp;</p>

<form METHOD="POST" NAME="MyForm" action="--WEBBOT-SELF--">
  <!--webbot bot="SaveResults" startspan U-File="_private/form_results.txt"
  S-Format="TEXT/CSV" S-Label-Fields="TRUE" --><input TYPE="hidden" NAME="VTI-GROUP" VALUE="0"><!--webbot bot="SaveResults" endspan --><p><select
  LANGUAGE="JavaScript" ONCHANGE="window.location.href = &quot;gothere()&quot;" SIZE="1"
  NAME="MySelect">
    <option value="http:/webgrafxinc.com/acdispensing/map.htm">Map</option>
    <option value="http://webgrafxinc.com/acdispensing/news.htm">News</option>
  </select> <input TYPE="submit" VALUE="Submit" NAME="B1"> <input TYPE="reset" VALUE="Reset"
  NAME="B2"> </p>
</form>

<p>&nbsp;
</body>
</html>

In addition, when I make a menu selection, I get a message advising of a scripting error, which states:

Line:   5
Char:   1
Error:  'Window' is undefined
Code:   0

If you can make any further suggestions it would be greatly appreciated.  Thanks Christian.

Dave

0
 
LVL 3

Expert Comment

by:bigelos
ID: 1844129
Try this code:



      <html>

      <head>
      <title>New Page 1</title>
      <script LANGUAGE="JavaScript">
      <!--
      function gothere(){
      var selIdx = document.MyForm.MySelect.selectedIndex
      location.href = document.MyForm.MySelect.topions[selidx].value
      }
      //-->
      </script>

      </head>

      <body>

      <form METHOD="POST" NAME="MyForm" action="gothere()">
      <select NAME="MySelect">
          <option value="http:/webgrafxinc.com/acdispensing/map.htm">Map</option>
          <option value="http://webgrafxinc.com/acdispensing/news.htm">News</option>
      </select>
      <input TYPE="submit" VALUE="GO!" NAME="B1">
      </form>

      </body>
      </html>

No, I don't want the points....give them to Christian.      </form>
0
WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

 
LVL 3

Expert Comment

by:bigelos
ID: 1844130
In my above comments, change
location.href = document.MyForm.MySelect.topions[selidx].value

to
location.href = document.MyForm.MySelect.options[selidx].value

And, you'll probably want to put the </form> before my comments about the points.
0
 
LVL 5

Expert Comment

by:Christian_Wenz
ID: 1844131
thanks bigelos, you are right. so dpate, tell us if this works
0
 

Author Comment

by:dpate
ID: 1844132
No luck, browser still tries to go to a location with URL

http:www. ...gothere(), instead of the menu selection.

Also, still getting error message that "Window" id undefined.
0
 
LVL 3

Expert Comment

by:bigelos
ID: 1844133
Change
location.href = document.MyForm.MySelect.topions[selidx].value

to

window.location  = document.MyForm.MySelect.topions[selidx].value

(Yes, I really should run the code before I post it.)

OK, here is code that I am actually using:

<form name="form1" method="post" action="">
Select Desination:
<select name="dest" size="1">
      <option selected value="http://home.com">Home</option>  
      <option value="../../department.html">Departments Page</option>
      <option value="../engineering.html">Engineering Page</option>
         <option value="../smoke/index.html">Other Engineering</option>
      <option value="../testeng/job.html">What We Do</option>
      <option value="../testeng/projects.html">Current Projects</option>
         <option value="../testeng/benchmarks/benchmarks.html">Benchmarks Report</option>
      <option value="../testeng/quality/QAG.html">Quality at a Glance</option>
</select>


<input type=button
onClick="location=document.form1.dest.options[document.form1.dest.selectedIndex ].value;"

value="Beam Me Up"
</form>

0
 

Author Comment

by:dpate
ID: 1844134
Found my answer on the FrontPage98 newsgroup.  code I was looking for is on site:

http://www.sitecrafters.com/support/fp98/listbox.htm

Dave
0
 
LVL 5

Expert Comment

by:Christian_Wenz
ID: 1844135
do you want to delete this question now?!
0
 

Author Comment

by:dpate
ID: 1844136
Yes, please delete question.

Thanks.

Dave Pate
0
 
LVL 84

Expert Comment

by:ozo
ID: 1844137
(wouldn't it be nice if one could just withdraw an answer that's locking a question, thus allowing the asker to delete the question without having to either bother linda in the customer service area, or reject the answer and wait three weeks?)

0

Featured Post

WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question