Page 1 of 1
Passing text between <option></option> to text b
Posted: Thu Oct 27, 2005 9:52 am
by Curtis782
I have a JavaScript SELECT menu and am trying to find a way to print the currently selected option to a text box field (versus the value).
<option value="X">text line X</option>
In other words, I am trying to have the "text line one" pass to a text box when a user selects an option. Anyone know how I could do this?
Some starter code:
Code: Select all
function displaydesc1()
{
document.add_form.desc1.value=document.add_form.partNo1_select.options[document.add_form.partNo1_select.selectedIndex].value;
for (var i = 0; i < document.add_form.partNo1_select.length; i++)
{
document.add_form.partone.value=document.add_form.options[i].selected;
}
}
</script>
Posted: Thu Oct 27, 2005 10:11 am
by Chris Corbyn
Code: Select all
<script type="text/javascript">
<!--
function showSelectedText(what, where)
{
document.getElementById(where).innerHTML = what;
}
// -->
</script>
<div id="an_example_div"></div>
<select name="something" onchange="showSelectedText(this.options[this.selectedIndex].text, 'an_example_div');">
<option value="foo">Text for option one</option>
<option value="bar">Text for option two</option>
</select>
Posted: Thu Oct 27, 2005 10:12 am
by hawleyjr
Code: Select all
//untested
<script language="JavaScript">
function sendToText(selObj){
var txtBox = document.getElementById("textbox");
txtBox.value = selObj[selObj.selectedIndex].text;
}
</script>
<select name="testlist" onChange="sendToText(this);">
<option value="1">item 1</option>
<option value="2">item 2</option>
<option value="3">item 3</option>
</select>
<input name="testbox" id="textbox" type="text">
Posted: Thu Oct 27, 2005 10:22 am
by feyd
Client-side...

found solution
Posted: Thu Oct 27, 2005 10:28 am
by Curtis782
Thank you for the advice. I found a solution:
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Example</title>
</head>
<script language="JavaScript" type="text/javascript">
<!--
function showSelected()
{
var selObj = document.getElementById('selSeaShells');
var txtIndexObj = document.getElementById('txtIndex');
var txtValueObj = document.getElementById('txtValue');
var txtTextObj = document.getElementById('txtText');
var selIndex = selObj.selectedIndex;
txtIndexObj.value = selIndex;
txtValueObj.value = selObj.options[selIndex].value;
txtTextObj.value = selObj.options[selIndex].text;
}
//-->
</script>
<body>
<form name="Example_Form">
<p> <select id="selSeaShells" onChange="showSelected();">
<option value="val0">sea zero</option>
<option value="val1">sea one</option>
<option value="val2">sea two</option>
<option value="val3">sea three</option>
<option value="val4">sea four</option>
</select>
</p>
<p> <input type="text" id="txtIndex" /> selectedIndex <br />
<input type="text" id="txtValue" /> options[].value <br />
<input type="text" id="txtText" /> options[].text <br />
</p>
</form>
</body>
</html>