SOPHIAKNOWS | CODEBASE > JAVASCRIPT

<script type='text/javascript'>
<!--
/* --------------------------------- */
/*     SOPHIAKNOWS: JAVASCRIPT       */
/* --------------------------------- */
/*         FORM SUBROUTINES          */
/* --------------------------------- */
/*  Created:  2000-03-15             */
/*  Issued:   2000-03-15             */
/*  Modified: 2004-12-17             */
/*  Component AUTOSUGGEST            */
/*  Copyright (c) 2000-2004          */
/*  Tony Pisarra, SophiaKnows        */
/* --------------------------------- */
/* --------------------------------- */

/*
  These subroutines perform an
  automated 'type-down'search and
  autofill function for a paired
  set of text-input/select-menu 
  controls
  
  As characters are entered in the 
  text-input, the original select
  options are replaced with a list 
  including only those options
  containing matches for the typed
  characters
*/

var fullnames=new Array();

// READ OPTION VALUES INTO ARRAY
function GetSelectVals(s) {
   for(i=0;i<s.length;i++) {
      fullnames[i]=s.options[i].value;
      }
   }

// GET AND DISPLAY SUGGESTIONS
function AutoSuggest(s,t) {
   suggestions=new Array();
   var y=0;
   for(m=0;m<fullnames.length;m++) {      // GET MATCHES
      if(fullnames[m].toLowerCase().indexOf(t.value.toLowerCase())>-1) {
         suggestions[y]=fullnames[m];
         y++;
         }
      }
   s.length=suggestions.length;           // RESET SELECT LENGTH
   for(i=0;i<suggestions.length;i++) {    // POPULATE SUGGESTIONS
      s.options[i].value=suggestions[i];   
      s.options[i].text=suggestions[i];   
      }
   s.selectedIndex=0;                     // SELECT FIRST ITEM
   }


// AUTO-FILL TEXT INPUT
function AutoFill(s,t) {
   if(s.focus) {
      t.value=s.options[s.selectedIndex].value;
      }
   }
-->
</script>

<body onload="GetSelectVals(document.forms['form1'].namesSelect)">
<form name="form1">
<p>Enter Teacher Name:
<br />
<input name="namesText" size="15"
   onKeyPress=AutoSuggest(this.form.namesSelect,this) />
<br />
   <select name="namesSelect" size="4"
    onchange="AutoFill(this,this.form.namesText)"
    onfocus="AutoFill(this,this.form.namesText)" style="width:150px;">
      <option value="Ms. Allan">Ms. Allan
      <option value="Mr. Anderson">Mr. Anderson
      <option value="Ms. Barok">Ms. Barok
      <option value="Dr. Fields">Dr. Fields
      <option value="Mr. Glenn">Mr. Glenn
      <option value="Ms. MacCauley">Ms. MacCauley
      <option value="Mr. Martin">Mr. Martin
      <option value="Ms. Walsh">Ms. Walsh
   </select>
</form>
</p>