Question

120

Twitter Typeahead.js how to return all matched elements within a string

rated 0 times [ 126] [ 6] / answers: 1 / hits: 6324 / 10 Years ago, thu, february 27, 2014, 12:00:00

By default twitter typeahead.js returns only elements matched in the begining of a string, for example:

source: ['type','typeahead','ahead']

query: 'type'

returns: 'type' and 'typeahead'

--

query: 'ahead'

returns: 'ahead'

I want it to return 'ahead' and 'typeahead'

my code:

var clients = new Bloodhound({

    datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.value); },

    queryTokenizer: Bloodhound.tokenizers.whitespace,

    limit: 10,

    prefetch: {

        url: '/clients.json',

        filter: function(list) {

            return $.map(list, function(value) { return { name: value }; });

        }

    }

});



clients.initialize();



$('.client').typeahead(null, {

    displayKey: 'value',

    source: clients.ttAdapter(),

    minLength: 1,

});

There is already a question about it but i didnt understand the answer.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

kaceyr

Add To Favorites

Follow

Total Points: 510

Total Questions: 97

Total Answers: 116

Location: Solomon Islands

Member since Fri, Oct 8, 2021

3 Years ago

kaceyr questions

1 TypeScript Expected 1 arguments, but got 2

Wed, Dec 15, 21, 00:00, 2 Years ago

1 How to show input fields based on mat radio button selection in angular material

Wed, Jun 24, 20, 00:00, 4 Years ago

1 How to change variable value in index.html based on the environment in angular

Thu, Feb 6, 20, 00:00, 4 Years ago

1 react dynamic import using a variable doesn't work

Sat, Oct 12, 19, 00:00, 5 Years ago

1 puppeteer-cluster: queue instead of execute

Mon, Aug 5, 19, 00:00, 5 Years ago

View All

answered 10 Years ago jelani · Accepted Answer

I found a solution... the problem was that I was so used to bootstrap2 typeahead that I wasn't understanding the datumTokenizer thing. If someone else find it hard to understand, I will put a little description below:

queryTokenizer: array of words you are querying, if you query for 'test abcd' it will transform the string into ['test','abcd'] and than look for matches with those two words.

datumTokenizer : array of words it will be matched with queryTokenizer. Each item from your JSON will have a set of words to be matched.

So if you have a source:

['good test','bad test']

and query for 'est'. You need to make datumTokenizer return an array containing 'est' , something like:

['good','test','ood','od','test', 'est', 'st'] for the first item

['bad','ad','test', 'est', 'st'] for the second item

Bellow is the code I wrote, I don't know if its the optimal thing for it, but I think it will help anyway:

new Bloodhound({

    datumTokenizer: function(d) {

        var test = Bloodhound.tokenizers.whitespace(d.value);

            $.each(test,function(k,v){

                i = 0;

                while( (i+1) < v.length ){

                    test.push(v.substr(i,v.length));

                    i++;

                }

            })

            return test;

        },

    queryTokenizer: Bloodhound.tokenizers.whitespace, 

    limit: 10,

    prefetch: {

        url: '/lista.json',

        ttl: 10000

    }

});