Bootstrap Typeahead

This demo shows how to integrate the Bootstrap 3 Typeahead library with Intercooler. (I chose to use the old type-ahead library rather than the new typeahead.js because it is simpler and integrates more cleanly with Bootstrap 3, but the same technique can be used with any callback-based completion library.)

By integrating intercooler and typeahead, you are able to take advantage of the declarative features of intercooler, such as trigger delay, the URL to issue the search to, etc.

Note that the "server side" implementation is mocked out using mockjax, so you can see the entire implementation. Click the "Source Code" tab to see the code.

Explanation

  • In the typeahead callback, invoke Intercooler.triggerRequest() on the element in question. Rather than doing a content swap, pass in a handler that properly funnels the resulting JSON into the typeahead callback.

Demo

Enter email: