我在同一页面的2个输入中实现了typeahead。一个完美无缺,但另一个有意想不到的行为。
我只能使用TypeAhead一次,只要我选择一个建议,输入字段就会填充正确的值,但我现在无法更改它的值。我将解释:
输入上的每个键事件都会触发一个js错误: - 未捕获的TypeError:undefined不是函数typeahead.js:944
return (str || "").replace(/^\s*/g, "").replace(/\s{2,}/g, " ");
然后,只要输入失去焦点,修改后的值就会从typeahead恢复为所选值。
希望这是我的代码的相关部分:
<input type="text" class="form-control text-center number" id="document" name="document" >
<script>
var invoices = new Bloodhound({
remote : "invoice/listInvoices?action=typeahead&q=%QUERY",
limit : 15,
queryTokenizer: Bloodhound.tokenizers.whitespace,
datumTokenizer : Bloodhound.tokenizers.whitespace("invoice")
});
invoices.initialize();
var invoiceTemplate = Handlebars.compile("<p>{{invoice}} - {{cusName}} - ${{value}}</p>");
$(document).ready(function() {
$("#document").typeahead({
minLength : 3,
hint : false,
highlight : true
},{
items : 15,
displayKey : "invoice",
source : invoices.ttAdapter(),
templates : {
empty : ["No Matches Found!"].join("\n"),
suggestion : invoiceTemplate
}
});
$("#document").bind("typeahead:selected", function(e, datum, name) {
$.ajax(
{
url : "invoice/listinvoices.jsp?document=" + datum.invoice,
success : function(data, textStatus, jqHXR)
{
$("#list").html(data);
}
});
});
</script>
答案 0 :(得分:3)
我发现了问题。碰巧displayKey是Invoice类的int字段。它不起作用。改为String,所有问题都没了!