Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Typeahead.js only matches beginning of the word

My Typeahead code is:

var events = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        limit: 100,
        prefetch: {
            url: Ajax.pluginurl + 'json/events.json',
            ttl: 1
        }
    });

    events.initialize();

    initialize_events_typeahead ();

    function initialize_events_typeahead () {
        $('.event_name').typeahead(null, {
            name: 'event',
            displayKey: 'name',
            source: events.ttAdapter(),
            templates: {
                empty: [
                    '<div class="empty-message">',
                    Ajax.no_results_found,
                    '</div>'
                ].join('\n'),
                suggestion: function(data){
                    return '<p><strong>' + data.name + '</strong> - ' + data.description + '</p>';
                }
            },
            engine: Hogan
        });


        $('.event_name').on("typeahead:selected typeahead:autocompleted", function(e,datum) {
            $(this).parent().parent().parent().parent().find('.event_description').val(datum.description);
        });
    }

For some reason, this code matches only the beggining of the name. However, on the demo http://twitter.github.io/typeahead.js/examples/, prefetch section, with the same code as far as I see, it matches even when starting to type something in the middle of the world.

How can I fix this? Thanks

EDIT: the JSON is:

[{"name":"P\u0159\u00edjezd host\u016f","description":"Cras ullamcorper ornare semper. Phasellus faucibus augue congue dapibus mollis. "},{"name":"Ob\u0159ad","description":"Curabitur fermentum diam quis viverra sodales. Phasellus sed sollicitudin magna, a dictum metus."},{"name":"Ve\u010dern\u00ed z\u00e1bava","description":"Curabitur fermentum diam quis viverra sodales."},{"name":"After-party","description":"Proin ipsum odio, vehicula vel diam a, dapibus suscipit velit. "},{"name":"Sn\u00eddan\u011b","description":"Proin ornare tempus ipsum at blandit. Nam hendrerit dolor et interdum vulputate."}]
like image 257
user1049961 Avatar asked May 03 '14 18:05

user1049961


1 Answers

Not sure about why their samples show the middle words matching, but I guess you are supposed to develop your own matching algorithm (datumTokenizer).

Here is my solution (temporary in case they implement something by default in the Bloodhound engine):

var engine = new Bloodhound({

    datumTokenizer: function(d){
        var tokens = [];
        //the available string is 'name' in your datum
        var stringSize = d.name.length;
        //multiple combinations for every available size
        //(eg. dog = d, o, g, do, og, dog)
        for (var size = 1; size <= stringSize; size++){          
          for (var i = 0; i+size<= stringSize; i++){
              tokens.push(d.name.substr(i, size));
          }
        }

        return tokens;
    },...
like image 118
mrcaramori Avatar answered Nov 10 '22 23:11

mrcaramori