Solved

Javascript to grab Text-Label as a value from a Select Box Option

Posted on 2007-11-16
4
1,011 Views
Last Modified: 2013-11-19
I have a select box and a hidden field.

I want to use an onchange handler to update the hidden field

<script>
function updHidden {
document.forms[0].TxtLabel=?
}
</script>
<select onchange=updHidden>
<option value=1>John Doe
<option value=2>Jane Doe
</select>
<hidden name=TxtLabel value="">

I can do the value part but this time I need the label and not sure how to get it.

Help.

0
Comment
Question by:Bob-Villa
  • 3
4 Comments
 
LVL 21

Expert Comment

by:nizsmo
Comment Utility
something like this:
<script>

function updHidden() {

document.getElementById('txtlabel').value="Your_Value_HERE";

}

</script>

<select onchange="updHidden();">

<option value=1>John Doe</option>

<option value=2>Jane Doe</option>

</select>

<hidden name="TxtLabel" id="txtlabel" value="">

Open in new window

0
 
LVL 21

Expert Comment

by:nizsmo
Comment Utility
also (not sure if this is what you mean) if you want the hidden value to take after the value selected with the select option box, then something like this will do it.
<script>

function updHidden() {

document.getElementById('txtlabel').value=document.getElementById('select_box').options[document.getElementById('select_box').selectedIndex].value;

}

</script>

<select onchange="updHidden();" id="select_box">

<option value=1>John Doe</option>

<option value=2>Jane Doe</option>

</select>

<hidden name="TxtLabel" id="txtlabel" value="">

Open in new window

0
 
LVL 1

Author Comment

by:Bob-Villa
Comment Utility
ok, this works but I have a conflict now. I have more than one of these select boxes on a page and after making multiple selects on multiple select boxes only one change is applies. It seems that since the value is "" that the javascript is only applying the last value when I select more than one box. i.e. I have 3 select boxes and 3 hidden inputs. I select all 3 select boxes but upon form submission only the last select box takes the change in value from "" to John Doe. The best way I can see to remedy this is to actually write the value to page somehow?

Is there a way to make this:
<hidden name="TxtLabel" id="txtlabel" value="">
look like this:
<hidden name="TxtLabel" id="txtlabel" value="John Doe">

after the select is changed using a document.write or text replace or innerhtml or something?
0
 
LVL 21

Accepted Solution

by:
nizsmo earned 500 total points
Comment Utility
Sorry if i misunderstood you but if you are wanting the result like this:
<hidden name="TxtLabel" id="txtlabel" value="John Doe">

can you not just change your selection box to this:
<select onchange="updHidden();" id="select_box">
<option value="John Doe">John Doe</option>
<option value="Jane Doe">Jane Doe</option>
</select>

and everything should work? or are you restricted in some way?
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Scripting vs. Programming languages 25 109
Create a new template 9 20
User profile Size Report 3 35
What does this javascript do? 7 23
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
Active Directory replication delay is the cause to many problems.  Here is a super easy script to force Active Directory replication to all sites with by using an elevated PowerShell command prompt, and a tool to verify your changes.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now