Search multiple values in array of JSON objects using Typeahead.js + Bloodhound remote

时间:2016-08-31 16:57:54

标签: jquery json typeahead.js bloodhound

I'm trying to use Typeahead.js (v0.11.1) + Bloodhound to display the results of a query. The query searches a list of users and returns matches based on either email, last_name, or first_name. If I query smi the matches look like this:

[{"email":"john@email.com","last_name":"Smith","first_name":"John"},
{"email":"bob@email.com","last_name":"Smith","first_name":"Bob"}]

My Bloodhound engine looks like this:

var userSearch = new Bloodhound({
    datumTokenizer: function (user) {
        return Bloodhound.tokenizers.obj.whitespace(user.email, user.last_name, user.first_name);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: '/search/users?query=%QUERY',
        wildcard: '%QUERY'
    }
});

The problem is Typeahead only shows a match when there is one JSON object, if it returns an array of objects, like the example above, then no matches.

I tried adding a transform to the remote, but then no matches were returned at all:

transform: function(users) {
    return $.map(users, function(user) {
        return {
            email: user.email,
            last_name: user.last_name,
            first_name: user.first_name
        }
    });
}

1 个答案:

答案 0 :(得分:2)

问题在于datumTokenizer,你必须连接这样的标记:

datumTokenizer: function (user) {
    var emailTokens = Bloodhound.tokenizers.whitespace(user.email);
    var lastNameTokens = Bloodhound.tokenizers.whitespace(user.last_name);
    var firstNameTokens = Bloodhound.tokenizers.whitespace(user.first_name);
    return emailTokens.concat(lastNameTokens).concat(firstNameTokens);
}

此外,您仍然需要使用transform上的remote。但现在您可以匹配每个JSON对象中的三个属性中的任何一个。