typeahead.js bloodhound minLength 不工作
typeahead.js bloodhound minLength not working
我已经使用远程数据源实现了 typeahead.js 和 bloodhound,它基本上按预期工作。但是,我已将 typeahead 上的 minLength 设置为 2,虽然我可以在 2 个字符(和 3 个)后看到 ajax 请求触发,但 typeahead 仅在 4 个或更多字符后提供建议。我的配置中是否缺少某些内容(我正在使用 typeahead.bundle.min.js)。
var local_authorities = new Bloodhound({
datumTokenizer: function (datum) {
return Bloodhound.tokenizers.whitespace(datum.value);
},
queryTokenizer: Bloodhound.tokenizers.whitespace,
identify : function(datum) {
//console.log(datum);
return datum.value;
},
remote: {
url: "/addresses/autocomplete_local_authorities/%QUERY",
wildcard: '%QUERY',
filter: function (data) {
// Map the remote source JSON array to a JavaScript object array
return $.map(data.local_authorities, function (local_authority) {
return {
id: local_authority.id,
value: local_authority.name
};
});
}
}
});
$('.typeahead.local-authority').typeahead({
hint: true,
highlight: true,
minLength: 2,
}, {
limit: 8,
source: local_authorities,
displayKey: 'value',
})
.on('typeahead:selected', function (e, item) {
$('[name="local_authority_ids"').val(item.id);
});
谢谢。
一些调试显示这是由函数 async(suggestions)
(第 1719-1727 行)引起的:
function async(suggestions) {
suggestions = suggestions || [];
if (!canceled && rendered < that.limit) {
that.cancel = $.noop;
rendered += suggestions.length;
that._append(query, suggestions.slice(0, that.limit - rendered));
that.async && that.trigger("asyncReceived", query);
}
}
该错误是由于在调用 append
之前将 rendered
设置为 suggestions.length
,因此当 Bloodhound 收到 5 个或更多查询结果时,suggestions.slice(0, that.limit - rendered)
总是空,因为标准 limit
是 5.
仅当远程端点 returns 少于 limit
个对象时才会添加建议,这在您的情况下会发生 4 个字母或更多。
由于我既不是 Typeahead 也不是 Bloodhound 的开发者,我不想(也没有时间)弄清楚为什么它会这样实现以及如何解决这个问题,但是,一个快速的解决方法是增加limit
.
它必须在第二个配置对象中设置,例如$( "#someId" ).typeahead( { ... }, {..., limit: 10, ...});
编辑:使用 typeahead/bloodhound v. 0.11.1
我已经使用远程数据源实现了 typeahead.js 和 bloodhound,它基本上按预期工作。但是,我已将 typeahead 上的 minLength 设置为 2,虽然我可以在 2 个字符(和 3 个)后看到 ajax 请求触发,但 typeahead 仅在 4 个或更多字符后提供建议。我的配置中是否缺少某些内容(我正在使用 typeahead.bundle.min.js)。
var local_authorities = new Bloodhound({
datumTokenizer: function (datum) {
return Bloodhound.tokenizers.whitespace(datum.value);
},
queryTokenizer: Bloodhound.tokenizers.whitespace,
identify : function(datum) {
//console.log(datum);
return datum.value;
},
remote: {
url: "/addresses/autocomplete_local_authorities/%QUERY",
wildcard: '%QUERY',
filter: function (data) {
// Map the remote source JSON array to a JavaScript object array
return $.map(data.local_authorities, function (local_authority) {
return {
id: local_authority.id,
value: local_authority.name
};
});
}
}
});
$('.typeahead.local-authority').typeahead({
hint: true,
highlight: true,
minLength: 2,
}, {
limit: 8,
source: local_authorities,
displayKey: 'value',
})
.on('typeahead:selected', function (e, item) {
$('[name="local_authority_ids"').val(item.id);
});
谢谢。
一些调试显示这是由函数 async(suggestions)
(第 1719-1727 行)引起的:
function async(suggestions) {
suggestions = suggestions || [];
if (!canceled && rendered < that.limit) {
that.cancel = $.noop;
rendered += suggestions.length;
that._append(query, suggestions.slice(0, that.limit - rendered));
that.async && that.trigger("asyncReceived", query);
}
}
该错误是由于在调用 append
之前将 rendered
设置为 suggestions.length
,因此当 Bloodhound 收到 5 个或更多查询结果时,suggestions.slice(0, that.limit - rendered)
总是空,因为标准 limit
是 5.
仅当远程端点 returns 少于 limit
个对象时才会添加建议,这在您的情况下会发生 4 个字母或更多。
由于我既不是 Typeahead 也不是 Bloodhound 的开发者,我不想(也没有时间)弄清楚为什么它会这样实现以及如何解决这个问题,但是,一个快速的解决方法是增加limit
.
它必须在第二个配置对象中设置,例如$( "#someId" ).typeahead( { ... }, {..., limit: 10, ...});
编辑:使用 typeahead/bloodhound v. 0.11.1