Please explain why/how to get multiple dropdowns to work on the same page

**ajfmrf** · 06-23-2014, 05:18 PM

1) Script Title: Drop-down Document Viewer

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...opdownview.htm

3) Describe problem: I need to be able to use multiple instances of this dropdown to load multiple pages into the iframe.

HTML Code:

<form name="[COLOR="#FF0000"]jumpy[/COLOR]">
<select name="example" size="1" onChange="gone()">
<!-- CHANGE THE BELOW URLS TO YOUR OWN-->
<option value="http://www.yahoo.com" selected>Yahoo.com</option>
<option value="http://www.google.com">Google</option>
<option value="http://www.lycos.com">Lycos</option>
<option value="http://www.AltaVista.com">AltaVista</option>
</select>

<input type="button" name="test" value="Go!" onClick="gone()">
</form>

<script language="javascript">
<!--

//Drop-down Document Viewer- © Dynamic Drive (www.dynamicdrive.com)
//For full source code, 100's more DHTML scripts, and TOS,
//visit http://www.dynamicdrive.com

//Specify display mode (0 or 1)
//0 causes document to be displayed in an inline frame, while 1 in a new browser window
var displaymode=1
//if displaymode=0, configure inline frame attributes (ie: dimensions, intial document shown
var iframecode='<iframe id="external" style="width:95%;height:400px" src="http://www.yahoo.com"></iframe>'

/////NO NEED TO EDIT BELOW HERE////////////

if (displaymode==0)
document.write(iframecode)

function gone(){
var selectedurl=document.[COLOR="#FF0000"]jumpy[/COLOR].example.options[document.[COLOR="#FF0000"]jumpy[/COLOR].example.selectedIndex].value
if (document.getElementById&&displaymode==0)
document.getElementById("external").src=selectedurl
else if (document.all&&displaymode==0)
document.all.external.src=selectedurl
else{
if (!window.win2||win2.closed)
win2=window.open(selectedurl)
//else if win2 already exists
else{
win2.location=selectedurl
win2.focus()
}
}
}
//-->
</script>

I have tried to change the form name in all instances for another dropdown but that does not work.

Can someone point me in the direction to get this to work ?

I will need to have around 24 or so dropdowns on this page each for different subjects

Thank you

**vwphillips** · 06-23-2014, 10:09 PM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
</head>

<body>
<form name="jumpy">
<select id="example" size="1" onchange="gone('example')">
<!-- CHANGE THE BELOW URLS TO YOUR OWN-->
<option selected value="http://www.google.com">Google</option>
<option value="http://www.dynamicdrive.com/forums/" selected >http://www.dynamicdrive.com/forums/</option>
<option value="http://www.lycos.com">Lycos</option>
<option value="http://www.AltaVista.com">AltaVista</option>
</select>
<input type="button" name="test" value="Go!" onClick="gone('example')">
<br /><br />
<select id="example2" size="1" onchange="gone('example2','external')">
<!-- CHANGE THE BELOW URLS TO YOUR OWN-->
<option value="http://www.google.com">Google</option>
<option value="http://www.dynamicdrive.com/forums/" selected >http://www.dynamicdrive.com/forums/</option>
<option value="http://www.lycos.com">Lycos</option>
<option value="http://www.AltaVista.com">AltaVista</option>
</select>
<input type="button" name="test" value="Go!" onClick="gone('example2','external')">
</form>

<iframe id="external" style="width:95%;height:400px" ></iframe>

<script language="javascript">
<!--
//Drop-down Document Viewer- © Dynamic Drive (www.dynamicdrive.com)
//For full source code, 100's more DHTML scripts, and TOS,
//visit http://www.dynamicdrive.com

function gone(id,ifr){
 var sel=document.getElementById(id),url;
 if (sel&&sel.value){
  url=sel.value;
  if (document.getElementById(ifr)){
   document.getElementById(ifr).src=url;
  }
  else if (gone.w){
   gone.w.location=url;window.open(url);
   gone.w.focus();
  }
  else {
   gone.w=window.open(url);
  }
 }
}
//-->
</script>
</body>

</html>

**ajfmrf** · 06-23-2014, 11:24 PM

I see how it was done Vic.

I was trying to change the form name and do it that way.

I see the select id is where I was missing it.

The first dropdown was set to open a new window when the links were selected.

I made the correction for my needs to get the links to all open in the iframe.

Thanks for the quick reply Vic