Typeahead.js not filtering results when typing

Question

I use following code for typeahead.js

var countries = new Bloodhound({
    datumTokenizer: function(d) {
        return Bloodhound.tokenizers.whitespace(d.en_name);
    },queryTokenizer: Bloodhound.tokenizers.whitespace,
    limit: 100,
    remote: {
        url: 'http://domain.com/json.php?action=countries',
    }
});

countries.initialize();

$('.lang').typeahead(null, {
    name: 'countries',
    displayKey: 'en_name',
    source: countries.ttAdapter()
});

the json is:

[{"id":"1","cz_name":"\u010de\u0161tina","en_name":"Czech"},{"id":"2","cz_name":"angli\u010dtina","en_name":"English"},{"id":"3","cz_name":"n\u011bm\u010dina","en_name":"German"}]

When I start typing anything, even something that doesn't match any of the desired results, I get all the suggestions.

When I use:

var countries = new Bloodhound({
        datumTokenizer: function(d) {
            return Bloodhound.tokenizers.whitespace(d.en_name);
        },queryTokenizer: Bloodhound.tokenizers.whitespace,
        limit: 100,
        local: [{"id":"1","cz_name":"\u010de\u0161tina","en_name":"Czech"},{"id":"2","cz_name":"angli\u010dtina","en_name":"English"},{"id":"3","cz_name":"n\u011bm\u010dina","en_name":"German"}]
    });

it works just fine. What am I doing wrong?

Answer 1

I found an answer here: https://github.com/twitter/typeahead.js/issues/248

After thinking more on this i realized that it has to be responsibility of remote api to return filtered results, not the typeahead. Since i was using static json datasource my returned results are same every time for which one should use prefetch.