function SetProperties(xElem,xHidden,xserverCode,xignoreCase,xmatchAnywhere,xmatchTextBoxWidth,xshowNoMatchMessage,xnoMatchingDataMessage,xuseTimeout,xtheVisibleTime,xElement){
        var props={
            elem: xElem,
            hidden: xHidden,
            serverCode: xserverCode,
            regExFlags: ( (xignoreCase) ? "i" : "" ),
            regExAny: ( (xmatchAnywhere) ? "" : "^" ),
            matchAnywhere: xmatchAnywhere,
            matchTextBoxWidth: xmatchTextBoxWidth,
            theVisibleTime: xtheVisibleTime,
            showNoMatchMessage: xshowNoMatchMessage,
            noMatchingDataMessage: xnoMatchingDataMessage,
            useTimeout: xuseTimeout,
            element: xElement
          };
          AddHandler(xElem);
          return props;
    }
    
	var isOpera=(navigator.userAgent.toLowerCase().indexOf("opera")!= -1);
    function AddHandler(objText){
        objText.onkeyup = GiveOptions;
        objText.onblur = function(){
          if(this.obj.useTimeout)
          {
          	StartTimeout();
          }
          else
          {
          	setTimeout("HideTheBox()",300);
          }
        }
        if(isOpera)objText.onkeypress = GiveOptions;
    }
    
	var arrOptions = new Array();
    var strLastValue = "";
    var bMadeRequest;
    var theTextBox;
    var objLastActive;
    var currentValueSelected = -1;
    var bNoResults = false;
    var isTiming = false;

    function GiveOptions(e){
        var intKey = -1;
        if(window.event){
          	intKey = event.keyCode;
          	theTextBox = event.srcElement;
        }
        else{
          	intKey = e.which;
          	theTextBox = e.target;
        }
        if(theTextBox.obj.useTimeout){
          	if(isTiming)EraseTimeout();
          	StartTimeout();
        }
        if(theTextBox.value.length == 0 && !isOpera){
          	arrOptions = new Array();
          	HideTheBox();
          	strLastValue = "";
          	return false;
        }
        if(objLastActive == theTextBox){
          	if(intKey == 13){
            	GrabHighlighted();
            	theTextBox.blur();
            	return false;
          	}
          	else if(intKey == 38){
            	MoveHighlight(-1);
            	return false;
          	}
          	else if(intKey == 40){
            	MoveHighlight(1);
            	return false;
          	}
          	else{}
        }
        
        //ausgabe("Last Value: "+strLastValue);
        
        if(objLastActive != theTextBox || theTextBox.value.indexOf(strLastValue) != 0 || ((arrOptions.length==0 || arrOptions.length==30 ) && !bNoResults) || (theTextBox.value.length <= strLastValue.length)){
             objLastActive = theTextBox;
             bMadeRequest = true
             TypeAhead(theTextBox.value)
        }
        else if(!bMadeRequest){
          	BuildList(theTextBox.value);
        }
        strLastValue = theTextBox.value;
    } 
	
	function TypeAhead(xStrText){
        var strParams = "q=" + xStrText +
                        "&where=" + theTextBox.obj.matchAnywhere;
                        //alert(strParams);
        var loader1 = new net.ContentLoader(theTextBox.obj.serverCode,
                                            BuildChoices,null,"POST",strParams);
    } 
    
    function BuildChoices(){
        var strText = this.req.responseText;
        //alert(strText);
        eval(strText);
        BuildList(strLastValue);        
        
        bMadeRequest = false;
    }
    
    //Listing 10.13
    function BuildList(theText){
        SetElementPosition(theTextBox);
        //alert(theText);
        var theMatches = MakeMatches(theText);
        //alert(theMatches);
        theMatches = theMatches.join().replace(/\,/gi,"");
        if(theMatches.length > 0){
          document.getElementById("spanOutput")
            .innerHTML = theMatches;
          document.getElementById(
            "OptionsList_0").className=
            "spanHighElement";
          currentValueSelected = 0;
          bNoResults = false;
    }
    else
	{
        currentValueSelected = -1;
        bNoResults = true;
          if(theTextBox.obj.showNoMatchMessage)
            document.getElementById(
              "spanOutput").innerHTML =
              "<span class='noMatchData'>" +
              theTextBox.obj
              .noMatchingDataMessage +
              "</span>";
          else HideTheBox();
        }
        if(arrOptions.length*14 > 200)
        {
        	document.getElementById("spanOutput").style.height = "200px";
        	
        }
        else
        {
        	//alert(document.getElementById("spanOutput").offsetHeight + " - " + arrOptions.length*14);
        	document.getElementById("spanOutput").style.height = "";	
        	
        }
    }
    
    function SetElementPosition(theTextBoxInt){
        var selectedPosX = 0;
        var selectedPosY = 0;
        var theElement = theTextBoxInt;
        if (!theElement) return;
        var theElemHeight = theElement.offsetHeight;
        var theElemWidth = theElement.offsetWidth;
        while(theElement != null){
        	selectedPosX += theElement.offsetLeft;
          	selectedPosY += theElement.offsetTop;
          	theElement = theElement.offsetParent;
        }
        xPosElement = document.getElementById("spanOutput");
        
        if(theTextBoxInt.obj.matchTextBoxWidth)
        {
          	xPosElement.style.width = theElemWidth;
        }
        xPosElement.style.display = "block";
		if(document.all)
		{ 
			xPosElement.style.top = selectedPosY + theElemHeight;
        	xPosElement.style.left = selectedPosX;
        	xPosElement.style.width = theElemWidth-2;
		}
		else
		{
			xPosElement.style.top = (selectedPosY + theElemHeight) +"px";
        	xPosElement.style.left = selectedPosX +"px";
        	xPosElement.style.width = theElemWidth-2 + "px";
		}     
        
        if(theTextBoxInt.obj.useTimeout){
          	xPosElement.onmouseout = StartTimeout;
          	xPosElement.onmouseover = EraseTimeout;
        }
        else{
          	xPosElement.onmouseout = null;
          	xPosElement.onmouseover = null;
        }
      }

      var countForId = 0;
      function MakeMatches(xCompareStr){
        countForId = 0;
        var matchArray = new Array();
        var regExp = new RegExp(theTextBox.obj.regExAny + xCompareStr,theTextBox.obj.regExFlags);
        
		  //alert(regExp);
        for(i=0;i<arrOptions.length;i++){
        	
          var theMatch = arrOptions[i][0].match(regExp);
          if(theMatch){
            matchArray[matchArray.length]=
              CreateUnderline(arrOptions[i][0],
              xCompareStr,i);
          }
        }
        return matchArray;
      }


      var undeStart = "<span class='spanMatchText'>";
      var undeEnd = "</span>";
      var selectSpanStart = "<div style='width:99%;' class='spanNormalElement' onmouseover='SetHighColor(this)' ";
      var selectSpanEnd ="</div>";
      
	function CreateUnderline(xStr,xTextMatch,xVal)
	{		
		
    	selectSpanMid = "onclick='SetText(" + xVal + ")'" + "id='OptionsList_" + countForId + "' theArrayNumber='"+ xVal +"'>";
        var regExp = new RegExp(theTextBox.obj.regExAny +
        xTextMatch,theTextBox.obj.regExFlags);
        var aStart = xStr.search(regExp);
        //var ausgabe = xStr.indexOf("<plz:");
        //xStr = xStr.substring(0,ausgabe);
        var matchedText = xStr.substring(aStart,aStart + xTextMatch.length);        
        countForId++;
        //alert(xStr);
        return selectSpanStart + selectSpanMid + xStr.replace(regExp,undeStart + matchedText + undeEnd) + selectSpanEnd;
      }

      function MoveHighlight(xDir){
        if(currentValueSelected >= 0){
          newValue = parseInt(currentValueSelected) + parseInt(xDir);
          if(newValue > -1 && newValue < countForId){
            currentValueSelected = newValue;
            SetHighColor (null);
          }
        }
      }
      function SetHighColor(theTextBox){
        if(theTextBox){
          currentValueSelected =
          theTextBox.id.slice(theTextBox.id.indexOf("_")+1,
          theTextBox.id.length);
        }
        for(i = 0; i < countForId; i++){
          document.getElementById('OptionsList_' + i).className =
            'spanNormalElement';
        }
        document.getElementById('OptionsList_' +
          currentValueSelected).className = 'spanHighElement';
      }

      function SetText(xVal){
      	
        //var tmp = arrOptions[xVal][0];
        //var ausgabe = tmp.indexOf("<plz:");
        //tmp = tmp.substring(0,ausgabe);        
        tmp = arrOptions[xVal][0];
        theTextBox.value = tmp; //set text value        
        theTextBox.obj.hidden.value = arrOptions[xVal][1];
        document.getElementById("spanOutput").style.display = "none";
        currentValueSelected = -1; //remove the selected index
      }
      function GrabHighlighted(){
        if(currentValueSelected >= 0){
          xVal = document.getElementById("OptionsList_" +
          currentValueSelected).getAttribute("theArrayNumber");          
          SetText(xVal);
          HideTheBox();
        }
      }
      function HideTheBox(){
        document.getElementById("spanOutput").style.display = "none";
        currentValueSelected = -1;
        EraseTimeout();
      }

      function EraseTimeout(){
        clearTimeout(isTiming);
        isTiming = false;
      }
      function StartTimeout(){
        isTiming = setTimeout("HideTheBox()",theTextBox.obj.theVisibleTime);
      }
      
    function ausgabe(text)
    {
		var elm = document.getElementById('ausgabe');
		if(elm)
		{
			//elm.value += text+"\n";
		}	
	}