Q23 How do you pass an option from a drop down list from one form to a field on another form?

irt.org | Knowledge Base | JavaScript | Form 10.2 | Q23 [ previous next ]

Q23 How do you pass an option from a drop down list from one form to a field on another form?

In this example there are two forms within the same document called formName1 and formName2. Within formName1 there is a drop down select list called selectName1 and within formName2 there are two text box fields called textboxName1 and textboxName2

There are various events we could utilise to pass the value or text from the selected option to the text box, e.g. onClick, onChange, onFocus, onBlur and onClick.

In this example I shall use the onChange event to trigger the setForm2Value() function which will change the value of the two text boxes to the value and text of the selected option:

<script language="JavaScript"><!--
function setForm2Value() {
    var selectedItem      = document.formName1.selectName1.selectedIndex;
    var selectedItemValue = document.formName1.selectName1.options[selectedItem].value;
    var selectedItemText  = document.formName1.selectName1.options[selectedItem].text;
    
    if (selectedItem != 0) {
        document.formName2.textboxName1.value = selectedItemText;
        document.formName2.textboxName2.value = selectedItemValue;
    }
    else {
        document.formName2.textboxName1.value = "";
        document.formName2.textboxName2.value = "";
    }
}
//--></script>

<form name="formName1">
<select name="selectName1" onChange="setForm2Value()">
<option>Select one:
<option value="ill">Doc
<option value="miserable">Happy
<option value="cheerful">Grumpy
<option value="wide awake">Sleepy
<option value="smart">Dopey
<option value="boastful">Bashful
<option value="breathing">Sneezy
</select>
</form>

<p>

<form name="formName2">
<input type="textbox" name="textboxName1" value="" size="10">
is
<input type="textbox" name="textboxName2" value="" size="10">
</form>

Feedback on 'Q23 How do you pass an option from a drop down list from one form to a field on another form?'

What's New

How to do the impossible with Google Gears

Out and About

Last Updated: 30th March 2008. Maintained by: Martin Webb and Michel Plungjan
irt.org liability, trademark, document use, privacy statement and software licensing rules apply.