You also need to put in a little JavaScript code to tie the two together and tell Scriptaculous which input field you what to have Ajax properties, with the new Ajax.Autocompleter object. This object has three main parameters: The first parameter is the INPUT field id, the second is the DIV id, and the third is the URL, which should return dynamic suggestions. This object also has optional parameters, such as the minimum number of characters required for the query be auto submitted to the server.

The tying code of the JavaScript Ajax APIs with the HTML INPUT and DIV elements is achieved with the JS YAHOO.widget.AutoComplete object; it takes as parameters the names of the input, div, and dynamic content source. There are also a lot more JavaScript options in YUI than in Scriptaculous. For example, there is an option to fill in the first suggestion in the input field (ex typeAhead = true). Please see the included source code for the full demo.