我正在使用 Typeahead 设置一个表单。我有两个相邻的输入字段,并且每个输入字段都需要自动完成。我的 HTML 看起来像这样:
<select id="numerator">
<option value="presentation">presentation</option>
<option value="chemical">chemical</option>
</select>
<input id="numeratorId" class="typeahead" type="text" />
<br/>
<select id="denominator">
<option value="presentation">presentation</option>
<option value="chemical">chemical</option>
</select>
<input id="denominatorId" class="typeahead" type="text" />
每一个input
字段将通过查看 API 端点自动完成。这应该是这样的形式/api/1.0/code?type=presentation&code=123
or /api/1.0/code?type=chemical&code=123
.
的价值type
API 调用中的参数应取决于<select>
每个输入字段旁边的元素。
我遇到的问题是我不知道如何告诉 Bloodhoundtype
参数应该是。
理想情况下,我想将其传递给 Bloodhound,但我不知道该怎么做。
这是我的 JavaScript:
var bnfMatches = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: '/api/1.0/code?',
replace: function(url, uriEncodedQuery) {
url = url + 'code=' + uriEncodedQuery;
// How to change this to denominator for denominator queries?
val = $('#numerator').val();
if (!val) return url;
return url + '&code_type=' + encodeURIComponent(val)
}
}
});
$('.typeahead').typeahead({
hint: true,
highlight: true,
minLength: 2
},
{
name: 'states',
displayKey: 'id',
source: bnfMatches.ttAdapter()
});
如果有任何建议,我将非常感激。