use*_*590 5 typeahead typeahead.js twitter-typeahead
如何在选择建议时从typeahead.js获取id和value?
我有一个json如下:
[
{id:1, name:'paul'},
{id:2, name:'jim'},
{id:3, name:'tom'},
{id:4, name:'medor'},
{id:5, name:'janzy'}
]
Run Code Online (Sandbox Code Playgroud)
我创建了Bloodhound对象如下:
var bh = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: '//localhost/data/names.json',
identify: function(datum){
return datum.id;
}
});
Run Code Online (Sandbox Code Playgroud)
我实例化了typeahead如下:
$('#name').typeahead({"highlight":true}, {
"name":"name",
"source":bh,
"display":"value",
"limit":10
})
Run Code Online (Sandbox Code Playgroud)
我希望能够id在提交表格时获得.当我提交以下示例时,我只获得该name属性.
我试图通过javascript获取id如下:
$('#name').bind('typeahead:select', function(ev, suggestion){
console.log(suggestion);
})
Run Code Online (Sandbox Code Playgroud)
但suggestion包含一个只有我选择的文本值的对象
你有几个选择。
我认为重写该identity函数可能会满足您的需要。像这样的事情可能会让你到达那里:
identify: function(datum){
return { id: datum.id, value: data.name};
}
Run Code Online (Sandbox Code Playgroud)
我用于remote我的实际生产代码并使用filter选项返回显示值和键值。
它看起来像这样:
remote: {
url: '/some/url',
filter: function (data) {
if (data) {
return $.map(data, function (object) {
return { id: object.id, value: object.name};
});
} else {
return {};
}
}
}
Run Code Online (Sandbox Code Playgroud)
您还可以尝试使用该transform函数作为 的一部分prefetch,它看起来像这样:
prefetch: {
url: '/some/url',
transform: function (response) {
if (response) {
return $.map(response, function (object) {
return { id: object.id, value: object.name};
});
} else {
return {};
}
}
}
Run Code Online (Sandbox Code Playgroud)
该文档(可在此处获取)有些帮助,但没有太多内容来显示更复杂的示例。
在我最终找到答案之前,我还对示例(预先输入示例)进行了相当多的实验。
| 归档时间: |
|
| 查看次数: |
4827 次 |
| 最近记录: |