...

View Full Version : help with dropdown list



CodeGnome
12-28-2005, 08:42 PM
Hello everyone
I am new to javaScript but not new to programming. I have a drop down list box that i am trying to select information from. Each entry in the list has a value that is set to a URL. I then have a push button that i have put a java script function in the onClick event of the button. What i want it to do then is get the url value of the selectedIndex of the list and activate that page. Below is the code that i have but i cannot get it to load the new url page. Can someone help me out? I was following a "tutorial" from javascriptkit.com to get this far but the code from the site must be messed up. Thanks in advance for any help you can give me.



<form name="DropDown1">
<p><select name="example" size="1">
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
</select></p>

<input type="button" name="ListTest" value="List Test" onclick="play()">
</form>

<script type="text/javascript">
<!--
function play()
{
location=document.DropDown1.example.options
[document.DropDown1.example.options.selectedIndex].value)
}
//-->
</script>

konithomimo
12-28-2005, 09:35 PM
This

location=document.DropDown1.example.options
[document.DropDown1.example.options.selectedIndex].value


should be

window.location.href=document.DropDown1.example.options
[document.DropDown1.example.options.selectedIndex].value;

That is, if you want to change the location of the entire page. IF you want to load that page into an iframe or something then give the iframe and ID, such as 'selectFrame':

id="selectFrame"

and then just do:

document.getElementById('selectFrame').src= document.DropDown1.example.options
[document.DropDown1.example.options.selectedIndex].value;

CodeGnome
12-28-2005, 09:47 PM
Ahh thanks konithomimo. Following your advice i was able to figure out exactly what i was doing wrong. In my function code at the end of the line i had a ")" and it was messing up the function call. Using the following line of code works perfectly:



location=document.DropDown1.example.options
[document.DropDown1.example.options.selectedIndex].value


It seems to work even if i do not put the window.location.href information in there. What i had before had a ')' after the word value. Thanks for your help!

Perhaps you could help me next by telling me how to get an event to happen once you select something from the list instead of selecting something from the list and then having to press a button? For instance, using the previous list box i select Google and as soon as i select it, the page is changed to the url for the selection i chose, which would be www.google.com in this case. Is there some event that happens when you select an item in the list like the onClick event for the push button?

cyber11
12-28-2005, 10:06 PM
These do not require the separate function.
One with a button, the other uses the onChange handler.

-Bill



<form name="DropDown1"><p>
<select name="example1" size="1" onChange="window.open(this.options[this.selectedIndex].value,'_blank')">
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
</select>

<br><br><br><br>
<select name="example2" size="1">
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
</select>

<br>
<input type="button" name="ListTest"
value="List Test" onClick="window.open(example2.options[example2.selectedIndex].value,'_blank')">
</form>

CodeGnome
12-28-2005, 10:10 PM
That is great! Thanks cyber11! :) I knew there had to be one since i had seen it used like that on websites. I just couldn't figure out the event to use and how to use it. :D

I thought at first it wasn't working but i was just typing too fast. :lol:

CodeGnome
12-29-2005, 12:02 AM
Just curious cyber11 but what does the '_blank' do for the function? I removed it and it appeared to work the same. Can you give me some insight on what it does and what the paramater for the function is supposed to do? Thanks for your help too. :)

cyber11
12-29-2005, 12:08 PM
CodeGnome-

Can you give me some insight on what it does and what the paramater for the function is supposed to do? Good question.
It does nothing and I should have noticed it yesterday.
I just did a cut and paste as the page it came from is about 2 years old and at some point I was probably trying something and forgot to remove it.
It was the second parameter in a function call to some larger script. But looking at it now I can't imagine what.

-Bill

CodeGnome
12-29-2005, 01:45 PM
<lol> I have had that happen to me several times. :) Thanks again for your help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum