
/* ===============================================================

	getindex.js
	acdhirr 6-2007 www.trilobiet.nl

	Call as: setSuggestable('input1','selfield1') to append a 
	suggestions dropdown to textfield input1 showing records 
	from the datafield that the user selects in selfield1.
	
	Function requestIndex contains the url to the serverscript 
	generating the index.
	
	To exclude options from selfield1 give them class="idx:0".
	
	Required: engine.cfm uit	JSMX (JavaScript MX) - Universal 
	Ajax API for ColdFusion, PHP, .NET, or anything other 
	language.

=============================================================== */

function setSuggestable(iptId,selId) {	

	var oIpt = document.getElementById(iptId);
	var oSel = document.getElementById(selId);

	// create outer div 
	var DIV = document.createElement('DIV');
	DIV.className = 'suggestions';
	DIV.id = 'sugs_'+iptId;
	
	// create selectbox
	var SEL = document.createElement('SELECT');
	SEL.style.width = '100%';
	SEL.size=15;
	SEL.id = 'sugssel_'+iptId;
	SEL.onclick = function() {
		if (this.options.length) {
			oIpt.value = this.options[this.selectedIndex].value; 
			hideSug(DIV);
		}	
	}
	SEL.onkeyup = function(e) {
		if(!e)e=event;
		if(e.keyCode==13 && this.options.length) {
			oIpt.value = this.options[this.selectedIndex].value; 
			hideSug(DIV);
		}
	}
	SEL.onblur = function(e) {
		hideSug(DIV);
	}
	
	// append all under inputbox
	DIV.appendChild(SEL);
	oIpt.parentNode.appendChild(DIV);
	
	// set events for inputbox
	oIpt.onkeyup = function(e) {
		if(!e)e=event;
		requestIndex(this,oSel,DIV,e.keyCode);
	}

}

/* perform Ansynchronous search */
function requestIndex(oInput,oSelTable,oSugbox,nKey) {

	var letters = oInput.value;

	// min 3 characters
	if (letters.length >= 3) { 
	
		/* set focus to dropdown */
		if(nKey == 40 && oSugbox.style.display != 'none') { 

			oSugbox.getElementsByTagName("SELECT")[0].focus();
			var opts=oSugbox.getElementsByTagName("OPTION");
			if (opts[0]) opts[0].selected = "selected";
		}
		/* perform search */
		else {	
		
			var tablename = oSelTable.options[oSelTable.selectedIndex];
			// is there an index available for this field?
			if (tablename.className!='idx:0') {
			
				clearSug(oSugbox);
				showSug(oSugbox);
			
				http( 
					"GET", 
					"index.cfm?fuseaction=search.getindex&index="+tablename.value+"&letters="+letters+"&outputelement="+oSugbox.id+"&inputelement="+oInput.id, 
					populateSug );
			}	
		}	
	}
}

/* clear suggestion box */
function clearSug(oSugbox) {

	var oSel = oSugbox.getElementsByTagName("SELECT")[0];
	var kids = oSel.childNodes;
	for ( var i= kids.length-1; i>= 0; i-- ) {
		oSel.removeChild(kids[i]);
	}	
}

/* hide suggestion box */
function hideSug(oSugbox) {

	oSugbox.style.display = 'none';
	oSugbox.style.zIndex = '0';
}

/* show suggestion box */
function showSug(oSugbox) {
	
	oSugbox.style.display = 'block';
	oSugbox.style.zIndex = '10';
}

/* load suggestions in box */
function populateSug(result) { 

	var oSugbox = document.getElementById(result.outputelement);
	clearSug(oSugbox);
	var oSel = oSugbox.getElementsByTagName("SELECT")[0];

	for( var i=0; i < result.output.length; i++) {

		var OPT = document.createElement('OPTION');
		OPT.value = result.output[i].value;						
		OPT.innerHTML = result.output[i].value+"&nbsp;("+result.output[i].occurances+")";						
		oSel.appendChild(OPT);
	}
}
