How to create dynamic autocomplete search using Bootstrap Typeahead ?

In this article, we will learn to implement dynamic autocomplete search using Bootstrap Typeahead. BootstrapTypeahead is a plugin that helps to add a beautiful autocomplete option in the search bar. 

In this approach, we will be taking static data for autocomplete, but we can also use dynamic JSON data as well, to show search options. The methods used in the Typeahead plugin are as follows.

• .typeahead(options): Initializes an input with a typeahead.
• .lookup: To trigger the lookup function externally.
• .getActive: To get the currently active item, you will get a string or a JSON object depending on how you initialized typeahead. It works only for the first match.

Example: The following example demonstrates the dynamic autocomplete search using Bootstrap Typehead.

Output: