为什么我的datumTokenizer永远不会被调用?
我在datumTokenizer函数中放置了一个断点,但它似乎永远不会被调用。为什么不?它是否适用于仅限远程的数据?为什么我的datumTokenizer永远不会被调用?
var engine = new Bloodhound({
datumTokenizer: function(d) {
return Bloodhound.tokenizers.obj.whitespace(d);
},
queryTokenizer: Bloodhound.tokenizers.nonword,
identify: function(obj) { return obj.id; },
remote: {
url: '/typeahead/%QUERY',
wildcard: '%QUERY'
},
limit: 5
});
$('#city_or_zip').typeahead({
hint: true,
minLength: 2
}, {
display: function(data) {
return formatCityState(data);
},
source: engine.ttAdapter(),
templates: {
empty: 'No results found',
suggestion: function (data) {
return '<p>' + formatCityState(data) + '</p>';
}
}
});
JSON从远程返回:
[
{
"id":568,
"state":"al",
"city":"pittsview"
},
{
"id":4095,
"state":"ga",
"city":"pitts"
}
]
这里是工作示例http://jsfiddle.net/x7pLsb79/
我远程数据的点点modified.instead我用的地方,但两者的工作方式相同。
HTML
<input id="city_or_zip" class="typeahead"></input>
JS
var dt=[
{
"id":568,
"state":"al",
"city":"pittsview"
},
{
"id":4095,
"state":"ga",
"city":"pitts"
}
];
var formatCityState= function(data){
return data.city+"*formated*"+data.state ;
}
var engine = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace("city"),
queryTokenizer: Bloodhound.tokenizers.whitespace,
local:dt
});
$('#city_or_zip').typeahead({
hint: true,
minLength: 1
}, {
display: function(data) {
return formatCityState(data);
},
source: engine.ttAdapter(),
templates: {
empty: 'No results found',
suggestion: function (data) {
return '<p>' + formatCityState(data) + '</p>';
}
}
});
谢谢。问题是我想写我自己的标记器。当我将datumTokenizer变量设置为我的函数时,它永远不会被调用。 –
emm,我不确定怎么得到最后的结果,对不起。但如果你想像somethnh appy这样(datumTokenizer:Bloodhound.tokenizers.obj.whitespace(“mytoken”)),我想你需要首先通过过滤结果,filter:function(data){return newarray} – sakir
远程数据没有被编入索引,作为显影剂中this issue说明。有一个提交作为一个选项添加。顺便提一下,twitter typeaheadjs项目目前已被放弃,所以谁知道何时可以合并该提交。围绕叉提交的内容可能会合并到其中(参见here)。
已解决此问题? – Zion
一个好的解决方案
autocomplete:function(){
var branchOffice = $('#branch_office_id').val();
var productSource = new Bloodhound({
datumTokenizer: function(productObj) {
return Bloodhound.tokenizers.whitespace([productObj.product.name+' '+productObj.product.sku+' '+productObj.product.code+' '+productObj.product.category.name+' '+productObj.product.unit.name]);
},
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: {
url: url_product+'/'+branchOffice,
cache: false,
}
});
$('#search_product').typeahead({
hint: true,
highlight: true,
minLength: 1
},{
name: 'name',
displayKey: function(data) {
return data.product.name;
},
limit: 10,
source: productSource.ttAdapter(),
templates: {
empty: function(){
return '<div class="widget-main"><div class="alert alert-danger">No encotramos coincidencias</div></div>'
},
suggestion: function (data){
return '<div>'+data.product.sku+' - '+data.product.name+' | '+data.product.code+' - '+data.product.category.name+' - '+data.product.unit.name+'</div>'
}
}
});
}
例JSON
[{
"id":29,
"product_id":10,
"branch_office_id":6,
"quantity":0,
"price_n":"1.00",
"price_h":"1.00",
"stock_min":1,
"product":{
"id":10,
"category_id":4,
"unit_id":2,
"sku":"010100001",
"code":"KE-1000011",
"name":"SIN CATEGORIA",
"image":"\/image\/avatars\/no_photo.jpg",
"order":1000011,
"price_buy":"1",
"category":{
"id":4,
"order":1,
"code":"01",
"abr":"KE",
"name":"KENDA"
},
"unit":{
"id":2,
"code":"01",
"name":"PZA"
}
}
},
{
"id":33,
"product_id":11,
"branch_office_id":6,
"quantity":0,
"price_n":"1.00",
"price_h":"1.00",
"stock_min":1,
"product":{
"id":11,
"category_id":4,
"unit_id":2,
"sku":"010100002",
"code":"KE-324233434",
"name":"SDFSDFSDFSD",
"image":"\/image\/avatars\/no_photo.jpg",
"order":324233434,
"price_buy":"1",
"category":{
"id":4,
"order":1,
"code":"01",
"abr":"KE",
"name":"KENDA"
},
"unit":{
"id":2,
"code":"01",
"name":"PZA"
}
}
}]
哦,这真的很棒!我在使用本地对象数组来处理我的Bloodhound实例时遇到了问题,我一直在使用googling并阅读文档,但是我没有看到有关如何正确处理自定义对象数组的示例。使用datumTokenizer解决了我的问题,就像你在这里所做的那样。非常感谢!! – Oswaldo
这里返回Bloodhound.tokenizers.obj.whitespace(d);你会传递字符串值Bloodhound.tokenizers.obj.whitespace(“name”) – sakir
尽管它甚至没有触及该代码。 datumTokenizer函数中没有任何内容被调用。 –
@StephenHorvath你有没有远程工作? – Zion