Bootstrap Typeahead with Ajax

by dshilkret

HTML

<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-typeahead.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<input type="text" id="search_book_title" data-provide="typeahead">

JavaScript

$('#search_book_title').typeahead({
    source:['Golden Fool','Fools Errand','Golden Shadow','Shadow Quest','Shadow of a Fool','Golden Food']
});
$('#search_book_title').typeahead({
   source: function (typeahead, query) {
        $.ajax({
            url: 'http://en.wikipedia.org/w/api.php?action=query&amp;amp;list=allpages&amp;amp;format=json&amp;amp;apnamespace=108&amp;amp;aplimit=10',
            type: 'POST',
            data: 'query='+query,
            dataType: 'JSON',
           async: 'false',
            success: function(data){
                console.log(data);
                typeahead.process(data);                
            }            
        });
    }
});

//


//$('#search_book_title').typeahead({
//   source: function (typeahead, query) {
//        $.ajax({
//            url: 'http://en.wikipedia.org/w/api.php?action=query&list=allpages&format=json&apnamespace=108&aplimit=10',
//            type: 'POST',
//            data: 'query='+query,
//            dataType: 'JSON',
//           async: 'false',
//            success: function(data){
//                console.log(data);
//                typeahead.process(data);                
//            }            
//        });
//    }
//});