CF_Jazz

Having your text form input autosuggest values for you from your database couldn’t be easier in ColdFusion 9.  There are really only two things you have to worry about: 1) the autosuggest value in your CFINPUT tag, and 2) the component function that performs the query for you, and then returns the result in an array.

Here is an example of a field that auto-suggests country names for you.

Here’s the CFINPUT:

<cfinput 
	type="text" 
	name="mailingCountry"
	value="#mailingCountry#"
	autosuggest="cfc:directoryName.componentName.suggestCountry({cfautosuggestvalue})"
	="width: 275px; background-color: ##e2e2f2;"
	/>

In the database is a table filled with country names. Here’s the function to access it:

<cffunction name="suggestCountry" returnType="Array" access="remote" output="false">

<cfargument name="suggestValue" required = "true">

<cfquery 
	datasource="#request.thisDSN#"
	name="provideRecords"
	>
	SELECT DISTINCT  countryName
	FROM lookup_country
	WHERE countryName LIKE <cfqueryparam value="#suggestValue#%" cfsqltype="cf_sql_varchar">
	ORDER BY countryName
</cfquery>

<!--- Convert the query to an array. --->

<cfset var provideArray = ArrayNew(1)> 

<cfloop query="provideRecords"> 
  <cfset arrayAppend(provideArray, countryName)> 
</cfloop> 

<cfreturn #provideArray#>

</cffunction>

That’s it!  ColdFusion 9 writes the JavaScript/AJAX that queries the server and writes the results back to the input field.  Pretty easy, huh?