...

View Full Version : linking items in a list box to a webpage (with frames)



blkshirt
01-12-2004, 04:57 AM
Here's the little problem I have facing me...

I have a webpage that will have frames in it... There will be a top and left frame with a main area for placing html files. However the top and left frames will be static while the main area will change.

If I place a drop down list box on the left frame and it looks something like this:



<form name="dropdownlist1" method="post" action="">
<select name="select" size="1">
<option>Select an Event</option>
<option>100M Dash (P)</option>
<option>100M Dash (F)</option>
<option>200m Dash (P)</option>
</select>
</form>


How do I get each event to relate to a specific html file and show that html file that has been selected by the user to show up in the main page area? I've been told I should do this using javascript however I haven't been able to find exactly what I'm looking for. I did find an example of it here (http://www.deltatiming.com/events/2003/allohio/) but I've tried looking at the source code and I was just confused...

Thanks for your help!

blkshirt

glenngv
01-12-2004, 07:03 AM
<select name="select" size="1" onchange="if (this.selectedIndex>0) window.open(this.options[this.selectedIndex].value,'nameOfTargetFrame')">
<option>Select an Event</option>
<option value="p100.htm">100M Dash (P)</option>
<option value="f100.htm">100M Dash (F)</option>
<option value="p200.htm">200m Dash (P)</option>
</select>

or:

<select name="select" size="1" onchange="if (this.selectedIndex>0) top.frames['nameOfTargetFrame'].location.href=this.options[this.selectedIndex].value">
...

But I prefer the 1st solution.

blkshirt
01-12-2004, 07:15 AM
Originally posted by glenngv
<select name="select" size="1" onchange="if (this.selectedIndex>0) window.open(this.options[this.selectedIndex].value,'nameOfTargetFrame')">
<option>Select an Event</option>
<option value="p100.htm">100M Dash (P)</option>
<option value="f100.htm">100M Dash (F)</option>
<option value="p200.htm">200m Dash (P)</option>
</select>

or:

<select name="select" size="1" onchange="if (this.selectedIndex>0) top.frames['nameOfTargetFrame'].location.href=this.options[this.selectedIndex].value">
...

But I prefer the 1st solution.

Is
window.open(this.options[this.selectedIndex].value,

logical code? Or do I need to modify it???

If my target frame is "main.html" the code would look like this?



<select name="select" size="1" onchange="if(this.selectedIndex>0) window.open(this.options[this.selectedIndex].value,'main.html')">
<option>Select an Event</option>
<option value="p100.htm">100M Dash (P)</option>
<option value="f100.htm">100M Dash (F)</option>
<option value="p200.htm">200m Dash (P)</option>
</select>

glenngv
01-13-2004, 02:51 AM
You only need to modify the 2nd parameter in the window.open().
You should put the name of the target frame not the html page in it. Look at your frameset page where you define your three frames: top, left and main. If you name the main frame as mainFrame, the code would be:



<select name="select" size="1" onchange="if(this.selectedIndex>0) window.open(this.options[this.selectedIndex].value,'mainFrame')">
<option>Select an Event</option>
<option value="p100.htm">100M Dash (P)</option>
<option value="f100.htm">100M Dash (F)</option>
<option value="p200.htm">200m Dash (P)</option>
</select>


Of course, you also need to change the corresponding html page for each option



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum