Bootstrap Twitter typeahead shows not every item

Question

i get a json (with page title + url) from a REST

My problem is the dropdown shows only items which include the word i search for (eg i search " google ", my REST gives me a json with eg " google " and " g-mail " but the dropdown shows only " google ")

When i alert() the matches-variable i get eg " google " and " g-mail " (so the json is correct!)

$(function(){

    var obj = {};
    var matches = [];

    $(".typeahead").typeahead({
        source: function ( str, c ) {


            $.ajax({
                url:'http://QUERYURL' + str +'EXAMPLE',

                dataType: 'json',
                cache: false,
                success: function(data){

                    obj = {};
                    matches = [];

                    _.each( data.results, function(item){
                        matches.push( item.title );
                        obj[ item.title ] = "https:/"+item.url;
                    });

                    c(matches);
                }
            });
        },
        updater: function ( selectedName ) {

            url = obj[ selectedName ];
            window.open(url);
            return selectedName;
        }
    });
});

Answer 1

As far as I understand it, the typeahead will only show you items that are in your source JSON which match the characters typed in.

ie if you typed "g-" I imagine it would only show you "g-mail" and not "google"

That is how this typeahead works.

You should retrieve all possible entries once and let the typeahead work with that source list instead of getting a subset each time perhaps?

Answer 2

Use matcher.

The code would be like

matcher: function (item) {
                return true;
            }