Archiv der Kategorie: development

Javascript Auto Suggest

Searching for a simple auto suggest input field, I found:
http://www.javascriptsearch.com/tutorials/Advanced/tutorials/AUTOSUGGEST1.html
http://www.javascriptsearch.com/tutorials/Advanced/tutorials/AUTOSUGGEST2-1.html

Minor improvements added, results to download:
The Auto Suggest Controller can be used:

<script type="text/javascript">
var suggestControl;
window.onload = function () {
suggestControl = new AutoSuggestControl($TXT_FIELD_ID, new SuggestionProvider());
}
</script>

The AutoSuggestControl accepts a third optional parameter to configure the behaviour:

{typeAheadEnabled: $BOOLEAN, suggestDropDownEnabled: $BOOLEAN, minValueLength: $INTEGER

Each of this parameters is optional.
The default configuration:

typeAheadEnabled: false
suggestDropDownEnabled: true
minValueLength: 0

The AutoSuggest Controller to use
Base CSS
Base Data Provider to implement

US States Suggestion Provider
Test Provider with 15000 entries

Example

Javascript Alert

if (tzu == undefined) {
	var tzu = {};
}
tzu.alert = function(txt) {
	txt = txt.replace(/&Uuml;/g, "%DC");
	txt = txt.replace(/&uuml;/g, "%FC");
	txt = txt.replace(/&Ouml;/g, "%D6");
	txt = txt.replace(/&ouml;/g, "%F6");
	txt = txt.replace(/&Auml;/g, "%C4");
	txt = txt.replace(/&auml;/g, "%E4");
	txt = txt.replace(/&szlig;/g, "%DF");
	txt = txt.replace(/n/g, "%0A");
			
	alert(unescape(txt));
}