Jump to content

Set variable as selection from form drop down


benjoewilson

Recommended Posts

Hi bit of a noobie with javascript and hoping this is pretty basic,

My aim is to have users select from a drop down box. When the selection is made an image with a href is put into the page with the href incorporating the selection from the drop down.

so far I have named the form and selection box as below

<form action="addnewmemberconfirm.php" method="post" name="userselection">
<select name="usernameselected" onChange="selecteduser()">
.....list of optons closed form ect

and tried the javascript below.

<script type="text/javascript">
<!--
function selecteduser( )
{
var username = 'testvariable';
var usernameselected = document.userselection.usernameselected.value ;
alert ("user is " + username + usernameselected)
document.write ( '<a href="userdetails.php?username=' + usernameselected + '<img src="pic.jpg"></a>');
}
// -->
</script>

The alert is just for testing and comes up fine but with an empty usernameselected. I hoped the setting of the variable usernameselected would work but doesn't and I don't know how to get java to write the html exactly where the script is written.

apologies for quite how clueless I am, any help much appreciated.
Hi,
to get the variable usernameselected correct change it to this:

[code]
idx = document.userselection.usernameselected.selectedIndex;
var usernameselected = document.userselection.usernameselected.options[idx].value;
[/code]

You should move your javascript to the <head>-section of your html-code.
Put a <div id="imgplace"></div> where you want the image to show up
and then add this to the javacode, to put it there:
[code]
oImg = document.getElementById("imgplace");
oImg.innerHTML='<a href="userdetails.php?username=' + usernameselected + '<img src="pic.jpg"></a>';
[/code]


/micke
Thanks for that it is working exactly as I want in both Netscape and Firefox but I can't get it to recognise the variable in Explorer. I have narrowed the problem down to the below example.

[code]
<head>
<script type="text/javascript">
<!--
function selecteduser()
{
idx = document.userselection.selection.selectedIndex;
var selection = document.userselection.selection.options[idx].value;
oImg = document.getElementById("imgplace");
oImg.innerHTML='Selection = ' + selection;
}
-->
</script>
</head>
<form name="userselection">
    <select name="selection" onChange="selecteduser()">
    <option> 1
    <option> 2
    <option> 3
    </select>
<div id="imgplace"></div>
</form>
[/code]
yes, I didn't know what your selectbox looked like.. you can fix this in one of two ways.

Change the "selection" variable to grab the text of the options instead of the value. Or set the value param on every option in you selectbox.

like this:
[code]
var selection = document.userselection.selection.options[idx].text;
[/code]

or like this:
[code]
    <option value="1"> 1
    <option value="2"> 2
    <option value="3"> 3
[/code]


/micke

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.