[SOLVED] Forms, changing the text in an input box

[Nuggit]

I feel pretty dumb because it seems simple enough.

 

What I'm trying to do:

You pick a filename from the list, and javascript detects it and makes what you picked appear in the input box right beside it.

 

This is the form, pretty much (after the PHP code makes it):

<form action="" method="get">

<select name="fl">
<option value = "index" onClick="pickedFile(index)" selected>index</option>
<option value = "general" onClick="pickedFile(general)">general</option>
<option value = "test" onClick="pickedFile(test)">test</option>
</select>

<input type="text" name="f" id="fileinput" value="" />

<input type="submit" value="Open" /></form>

 

And the function pickedFile():

function pickedFile(pickd)
{
document.getElementById('fileinput').value = pickd;
}

 

I tried learning Javascript once, but for some reason I just don't click with that whole language. Any help is appreciated!

[fenway]

Unless you pick an image, and set the src, this won't work.

[Nuggit]

Unless you pick an image, and set the src, this won't work.

Nah, that has nothing to do with what I'm doing. If you're curious, this is part of a notepad-like thing on my site, and I'm trying to make it as quick as possible to open files. Before I just had it so that you typed into the [input] box the .txt file you wanted to open, but now I want to have it so that you can choose from a drop-down list. I made the drop-down list and I've figured out all the PHP that goes with it to keep it up to date.

 

My question is simply: How do you make it so that whatever you pick from the drop-down list gets mirrored into the input box?

So like, the drop down list has options "index", "general", and "test" in it. If you choose "general", then the word "general" suddenly appears in the input box.

 

Sorry if I'm unclear... I'd post the link to the page here, but there's a security hole that I know about that I don't feel up to fixing right now. ^^;;

[nogray]

options doesn't have an onclick event, only the select menu with an onchange event. This might work

 

<select name="fl" onChange="pickedFile(this.value)" >
<option value = "index" selected>index</option>
<option value = "general">general</option>
<option value = "test">test</option>
</select>

[Nuggit]

Ah, figures.

 

Thanks for the code, but I tried it and it didn't work for me.

[nogray]

not sure which part didn't work, I just copied this code and it worked for me,

<select name="fl" onChange="pickedFile(this.value)" >
<option value = "index" selected>index</option>
<option value = "general">general</option>
<option value = "test">test</option>
</select>
<input type="text" name="f" id="fileinput" value="" />
<script language="javascript">
function pickedFile(pickd)
{
document.getElementById('fileinput').value = pickd;
}
</script>

 

Let me know which part didn't work.

[Nuggit]

Ah. I copy-pasted exactly that code to a new page and compared the sources, and first I corrected this error

<script type="javascript">

and the script was in the head. When I moved it right below the input like you did, it started working. (I thought javascript functions were supposed to be in the head...)

 

But yay! It works.

 

Thank you, nogray!