How to write a combo box selection to a text box?

JavaScript
1

What Javascript code would I use in the code below to write a combo box selection into a textbox? AND THEN, if I selected a 2nd selection from the combo box, it would write that in the same text box right after the 1st selection (in other words, it wouldn’t erase the 1st selection).

Of course, there would need to be a single space to separate each sentence that gets written to the text box.

Thanks!

=================================

<html>

<select name=“ComboBox”>
<option value=“”>Option 1</option>
<option value=“”>Option 2</option>
<option value=“”>Option 3</option>
</select>

<textarea name=“TextBox”></textarea>

</html>

=================================

2 

document.getElementsByName('ComboBox')[0].onchange = function () {
	var textBox = this.form.elements['TextBox'];
	textBox.value += this.options[this.selectedIndex].text + "\
";
}
3

Hi Paul,

Thanks for your help. I put in the following code, but it didn’t work for some reason. I’m pretty new to this, so I’m sure it’s something simple.

=========================

<html>

<SCRIPT language=“JavaScript”>
document.getElementsByName(‘ComboBox’)[0].onchange = function () {
var TextBox = this.form.elements[‘TextBox’];
TextBox.value += this.options[this.selectedIndex].text + "
";
}
</SCRIPT>

<select name=“ComboBox”>
<option value=“”>Option 1</option>
<option value=“”>Option 2</option>
<option value=“”>Option 3</option>
</select>

<textarea name=“TextBox”></textarea>

</html>

==============================

4

Yes, when the script runs it cannot access elements that do not yet exist. This applies to all of the page code below the script.

Place the script at the end of the body, just before </body> or use some other method to run it after the page has loaded.

Placing the script at the bottom is one of the recommended best practices for speeding up your web site.

5

I just tried the code below but still nothing. Any clue what I’m doing wrong? Thanks…

========================

<html>

<body>

<select name=“ComboBox”>
<option value=“”>Option 1</option>
<option value=“”>Option 2</option>
<option value=“”>Option 3</option>
</select>

<textarea name=“TextBox”></textarea>

<SCRIPT language=“JavaScript”>
document.getElementsByName(‘ComboBox’)[0].onchange = function () {
var TextBox = this.form.elements[‘TextBox’];
TextBox.value += this.options[this.selectedIndex].text + "
";
}
</SCRIPT>

</body>

</html>

=================================

6

You’re using this.form but there is no form on the page.

Surround the form elements with the form tag and you’ll be fine.

7

Got it figured out now. Thanks for all your help Paul! :slight_smile: