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.
Link to comment
Share on other sites

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
Link to comment
Share on other sites

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]
Link to comment
Share on other sites

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
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • 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.