javascriptjquerytwitter-bootstrapbootstrap-typeahead

TypeError: $(...).typeahead is not a function

This is very basic code. Still I am facing a problem. I think I am missing something, as mentioned on bootstrap site

"Plugins can be included individually (though some have required dependencies), or all at once. Both bootstrap.js and bootstrap.min.js contain all plugins in a single file."

So I included boostrap.js and still getting that error, what are the other dependencies?

Below is the code.

<!DOCTYPE html>
<html>
    <head>
        <title>Member</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/bootstrap.min.js"></script>
        <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    </head>
    <body>
<div class="well">  
<input type="text" class="span3" id="search" data-provide="typeahead" data-items="4" />  
</div>
<script>  
 var subjects = ['PHP', 'MySQL', 'SQL', 'PostgreSQL', 'HTML', 'CSS', 'HTML5', 'CSS3', 'JSON'];   
$('#search').typeahead({source: subjects})  
</script>
    </body>
</html>

Regards

Aadam

Solution

  • if you see the error message "TypeError: $(…).typeahead is not a function" it mean typeahead function is not provided in the version of bootstrap you are using. Officially the typeahead is dropped from the new release 3.0. And is available separtely in typeahead.js.

    you need to include the the typeahead.js plugin the error will remove.