Lookup Lists: Updating the Text Field - Doc JavaScript

Updating the Text Field

When the user enters some characters in the text box, the script selects the corresponding option. However, the user may also select an option directly with the mouse. When the user changes the current selection, the onChange() event handler invokes the update() function, which displays the name of the current selection in the text field:

function update() {
  if ((!NS4 && !IE4) || NS4MAC) return;
  var form = document.organizer;
  var field = form.prefix;
  var list = form.list;
  field.value = list.options[list.selectedIndex].text;
}

The first statement terminates the function immediately if the user is not running Navigator 4.0x or Internet Explorer 4.0x, or if the browser is the Macintosh version of Navigator 4.0x. The text field simply doesn't exist otherwise, because that's how we designed it.

The second statement assigns a reference of the form to a local variable named form. The following statements create references of the text field and the select menu by appending the name of the desired element to the form's reference (they are both properties of the form).

list.options[list.selectedIndex] reflects the selected option, so list.options[list.selectedIndex].text is the selected text (the name of the selected site, in our example). As you can see, the name of the selected site is assigned to the field's value property, causing it to display in the text box.

Created: March 11, 1998
Revised: March 11, 1998

URL: https://www.webreference.com/js/column15/update.html