Creating the Type-Ahead Page

The type-ahead page is a JSP that is rendered repeatedly as the user types text in the search box on the search page. The type-ahead page is rendered as a dropdown of strings matching the current value in the text box. The frequency of rendering the page is controlled by the JavaScript autocompleter function, but typically it polls for changes several times a second so the autocomplete dropdown is updated frequently as the user types.

The following is an example of a type-ahead page. It uses a droplet of class atg.search.formhandlers.TypeAheadDroplet, which submits a request of class atg.search.routing.command.search.TypeAheadRequest and then renders the results returned by ATG Search. Several of the input parameters for the droplet are passed to the page as query parameters when the page is rendered by the JavaScript function.

<dsp:page>
<ul>
<dsp:droplet name="/atg/search/formhandlers/TypeAheadDroplet">
  <dsp:param bean="/atg/search/formhandlers/SearchContext" name="context"/>
  <dsp:param name="text" param="q"/>
  <dsp:param name="environment" param="environment"/>
  <dsp:param name="language" param="language"/>
  <dsp:oparam name="itemformat">
    <li><dsp:valueof param="match"/></li>
  </dsp:oparam>
</dsp:droplet>
</ul>
</dsp:page>

For more information about TypeAheadDroplet, see Appendix A, Commerce Search Servlet Beans.