AutoComplete Widget :: JavaScript Function

This example uses a DS_JSFunction DataSource with a JavaScript function that returns data as an array of strings. Since the data for this example is already loaded into memory, queries should be very fast to return data. Therefore, the AutoComplete instance is configured to have a query delay of zero seconds.

In this example, the AutoComplete instance is able to keep its container always open by customizing the appropriate CSS styles and enabling the alwaysShowContainer property. Hooking into the custom events containerExpandEvent and containerCollapseEvent and calling the setHeader, setBody, and setFooter methods dynamically updates the contents of the open container.

The container can be customized to display multiple data fields by customizing the AutoComplete's formatResults method.

Filter the US states:

Sample Code