Coldfusion makes it really easy to add autosuggest to a textbox (CF 8 and above only). the cfinput tag has a new attribute (autosuggest) that takes a list as an input and matches the entered text with this list.
so we have our list
<cfset myList = “jack,corey,david,sam”>
making the autosuggest is as easy as just adding the list to the cfinput tag
<cfform>
<cfinput name=”myInput” type=”text” autoSuggest=”#myList#”/>
</cfform>
You can also use data from a query to populate the textbox.
<cfquery name=”myQuery” datasource=”myDSN”>
SELECT firstName FROM Customer
</cfquery>
the input then changes to
<cfform>
<cfinput name=”myInput” type=”text” autoSuggest=”#valueList(myQuery.firstName)#”/>
</cfform>
One thing to keep in mind is that this way you append the whole list to the inline HTML of the page, so if you have a small list then its not a problem but if you have a massive list to check with, the page size could increase heaps. In those cases it is wiser to bind the input field to a CFC else use jQuery to make the autosuggest getting data via ajax from another page(i will post a jQuery alternative soon).
so here’s the final cfinput bound to a CFC
<cfform>
<cfinput name=”myInput” type=”text” autoSuggest=”cfc:myCFC.myFunction({value})”/>
</cfform>
Of course the function will have access set to remote and watch out for the onRequest function in the Application.cfc in case you use it.
