document.onkeyup = KeyCheck;       

    function KeyCheck(e)
    {
       var KeyID = (window.event) ? event.keyCode : e.keyCode;
       if (currentInput != ''){
       
           switch(KeyID)
           {

              case 37:
              //Arrow Left
              break;

              case 38:
              //Arrow Up
              if (curSelectedIndex==-1) {
                curSelectedIndex = maxAutoRecords-1;
                document.getElementById(currentInput + 'Table').getElementsByTagName('tr')[curSelectedIndex].style.background=bgColorTR;
                document.getElementById(currentInput + 'Link' + curSelectedIndex).focus();
              }else{
                  if (curSelectedIndex>=0){ document.getElementById(currentInput + 'Table').getElementsByTagName('tr')[curSelectedIndex].style.background='#ffffff'; }
                  curSelectedIndex = curSelectedIndex-1;
                  if (curSelectedIndex==-1){ document.getElementById(currentInput).focus(); }
                  if (curSelectedIndex>=0){
                  document.getElementById(currentInput + 'Table').getElementsByTagName('tr')[curSelectedIndex].style.background=bgColorTR;
                  document.getElementById(currentInput + 'Link' + curSelectedIndex).focus();
                  }
                  if (curSelectedIndex<0) {curSelectedIndex=-1;}
              }
              break;

              case 39:
              //Arrow Right
              break;

              case 40:
              //Arrow Down
              //select the next item
              //alert(curSelectedIndex + ' ' + maxAutoRecords);
              if (curSelectedIndex>=0){ document.getElementById(currentInput + 'Table').getElementsByTagName('tr')[curSelectedIndex].style.background='#ffffff'; }
              curSelectedIndex = curSelectedIndex+1;
              if (curSelectedIndex<=(maxAutoRecords-1)) {
              document.getElementById(currentInput + 'Table').getElementsByTagName('tr')[curSelectedIndex].style.background=bgColorTR;
              document.getElementById(currentInput + 'Link' + curSelectedIndex).focus();
              }else{
                curSelectedIndex=-1;
                document.getElementById(currentInput).focus();
              }
                            
              break;
           }
       }
    }

    function closeDiv() {
        document.getElementById(currentInput + 'Div').style.visibility='hidden';
        curSelectedIndex = -1;
        document.getElementById(currentInput).focus();
    }
    
    function getAutoComplete(searchtext, inputName, urlName){
        //alert(searchtext);
        //document.getElementById('productDiv').innerHTML = searchtext;
        if (lastSearch != searchtext) {
            if (searchtext == '' || searchtext == ' '){
                closeDiv();
                lastSearch = '';
            }else{
                loadXMLDocAutoComplete('/includes/AutoComplete/' + urlName + '.asp?searchtext=' + searchtext, inputName);
                currentInput = inputName;
                lastSearch = searchtext;
            }
        }
    }
    
    function getElementDims(obj){
        var yOffset = obj.offsetTop||0;
        var xOffset = obj.offsetLeft||0;
        var height = obj.offsetHeight||0;
        var width = obj.offsetWidth||0;
        elParent = obj.offsetParent;
        while(elParent){
            yOffset += elParent.offsetTop||0;
            xOffset += elParent.offsetLeft||0;
            elParent = elParent.offsetParent;
        }
        
        var readScroll;
        if((window.document.compatMode)&&
          (window.document.compatMode == 'CSS1Compat')){
            readScroll = window.document.documentElement;
        }else{
            readScroll = window.document.body;
        }
        if (readScroll.clientLeft != undefined) {
        xOffset -= (readScroll.scrollLeft - readScroll.clientLeft);
        }
        if (readScroll.clientTop != undefined) {
        yOffset -= (readScroll.scrollTop - readScroll.clientTop);
        }
        return {x:xOffset,y:yOffset,width:width,height:height};
      } 
    
    var xmlhttpAutoComplete;
    var currentInput='';
    var curSelectedIndex = -1;
    var maxAutoRecords=0;
    var lastSearch='';

    function loadXMLDocAutoComplete(url)
    {
    // code for Mozilla, etc.
    //alert(inputName);
    if (window.XMLHttpRequest)
      {
      xmlhttpAutoComplete=new XMLHttpRequest()
      xmlhttpAutoComplete.onreadystatechange=xmlhttpSetAutoComplete
      xmlhttpAutoComplete.open("GET",url,true)
      xmlhttpAutoComplete.send(null)
      }
    // code for IE
    else if (window.ActiveXObject)
      {
      xmlhttpAutoComplete=new ActiveXObject("Microsoft.XMLHTTP")
        if (xmlhttpAutoComplete)
        {
        xmlhttpAutoComplete.onreadystatechange=xmlhttpSetAutoComplete
        xmlhttpAutoComplete.open("GET",url,true)
        xmlhttpAutoComplete.send()
        }
      }
    }
    
    function xmlhttpSetAutoComplete()
    {
       
        // if xmlhttp shows "loaded"
        if (xmlhttpAutoComplete.readyState==4)
          {
          // if "OK"
          if (xmlhttpAutoComplete.status==200)
            {
                 
              //alert(xmlhttpAutoComplete.responseText);
              var autoObj = eval('(' + xmlhttpAutoComplete.responseText + ')');
              //alert(autoObj.autoComplete[0].name);
              if (autoObj.autoComplete.length > 0){
                  var tempText;
                  tempText = '<table id=\'' + currentInput + 'Table\'>';
                  maxAutoRecords = autoObj.autoComplete.length;
                  for (var x=0;x<autoObj.autoComplete.length;x++)
                  {
                    tempText = tempText + '<tr onMouseOut="this.style.background =\'#FFFFFF\'" onMouseOver="this.style.background=\'' + bgColorTR + '\'"><td class=\'autocomplete\'><a id="' + currentInput + 'Link' + x + '" href="#" onclick="javascript: lastSearch=\'' + autoObj.autoComplete[x].name + '\'; document.getElementById(\'' + currentInput + '\').value=\'' + autoObj.autoComplete[x].name + '\'; closeDiv();">' + autoObj.autoComplete[x].name + '</a></td></tr>';
                  }
                  tempText = tempText + '</table>';
                  //document.getElementById(currentInput + 'Div').innerHTML = tempText;
                  var l = document.getElementById(currentInput+'Div');
                  if (!l) {
                      l = document.createElement('div');
                      l.id = currentInput+'Div';
                      l.style.position = 'absolute';
                      
                      var dims = getElementDims(document.getElementById(currentInput));
                      //alert(dims.x + ' ' + dims.y + ' ' + dims.width + ' ' + dims.height);
                      
                      l.style.left = (dims.x + rightOfInput ) + 'px';
                      l.style.top = (dims.y + heightOfInput) + 'px';
                      l.style.backgroundColor = '#ffffff';
                      l.style.border = '1px solid gray';
                      l.style.padding = '1px';
                      l.style.zIndex = 1;
                      document.body.appendChild(l);
                  }else{
                    l.style.visibility='visible';
                  }
                  document.getElementById(currentInput + 'Div').innerHTML = tempText;
              }else{
                closeDiv();
              }
            }
          else
            {
                //error
            }
          }
    }