0

如果我使用 2.0.0 版本，我有以下代码肯定会返回正确的数据结果，但由于某种原因，引导程序的 typeahead 插件给了我一个错误。我将其粘贴在代码示例下方：

<input id="test" type="text" />

$('#test').typeahead({
    source: function(typeahead, query) {
        return $.post('/Profile/searchFor', { query: query }, function(data) {                
            return typeahead.process(data);
        });
    }
});

当我运行这个例子时，我得到了一个 jQuery 错误，上面写着以下内容：

**
item is undefined
matcher(item=undefined)bootst...head.js (line 104)
<br/>(?)(item=undefined)bootst...head.js (line 91)
<br/>f(a=function(), b=function(), c=false)jquery....min.js (line 2)
<br/>lookup(event=undefined)bootst...head.js (line 90)
<br/>keyup(e=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, more...})bootst...head.js (line 198)
<br/>f()jquery....min.js (line 2)
<br/>add(c=Object { originalEvent=Event keyup, type="keyup", timeStamp=145718131, <br/>more...})jquery....min.js (line 3)
<br/>add(a=keyup charCode=0, keyCode=70)jquery....min.js (line 3)
<br/>[Break On This Error]  
<br/>return item.toLowerCase().indexOf(this.query.toLowerCase())**

有什么想法吗？...相同的代码在插件的 2.0.0 版本中有效，但无法写入我的淘汰对象模型。

这是 2.0.0 版本的有效输入代码：

var searchFunction = function(typeahead, query) {
        $.ajax({
            url: "/Profile/searchFor?tableName=" + tableName + "&query=" + query + "&extendedData=" + $("#" + extendedData).val(),
            success: function(data) {
                if (data.errorText != null) {
                    toggleLoading("false");
                    showDialog(data.errorText, "Error");
                    return;
                }                
                var result = data.results.split("::");
                typeahead.process(result);
            },
            select: function(event, ui) {
            }
        });
    }

    $("#" + inputBoxId).typeahead({
        source: searchFunction,
        onselect: function(obj) {
        }
    });
4

3 回答 3

4

1) Bootstrap typeahead v2.0.2 解决方案

看看这个拉取请求，它看起来就像你正在寻找的东西（它是来自 bootstrap typeahead v2.0.2 的一个分支）。

我自己使用它并且它正在工作:)

2) Bootstrap typeahead v.2.1.0-work in progress 解决方案

你也可以试试这个解决方案。我刚刚更改了我的项目以使用这个，因为它将在未来的版本中得到支持并且它看起来更干净:)

就我而言：

$("#typeahead").typeahead({
  source: function(query, process) {
    $.post('url_path', { q: query, limit: 4 }, function(data) {
      process(data);
    }); // end of post
  }
});

其中脚本url_path需要 2 个参数q（字符串）和limit（结果限制）并返回 json 响应（数组）：

对限制为4的查询i的示例响应：

[“阿姆”、“跛行 Bizkit”、“蕾哈娜”、“威尔·史密斯”]

于 2012-07-06T19:14:49.227 回答
2

对于试图生成 JSON 数据（不使用 php json_encode）并想知道为什么Terry Rosen 的 bootstrap-typeahead fork不适用于 ajax 调用的人

返回的 JSON 数据的格式必须为：-

[{"id":"1","name":"旧车"},{"id":"2","name":"卡斯特罗电车"},{"id":"3"," name":"绿色老爷车"},{"id":"4","name":"停在古董街的汽车"}]

注意引号

花了一整天的时间试图找出问题所在，我认为把它贴在这里是明智的。也许，我对 JSON 的理解是错误的，但是即使没有引用 id 和 name 字段，firebug 也会将返回的数据显示为有效的 JSON。此外，响应标头应设置为 'application/json'。希望这可以帮助某人。

于 2012-08-06T11:50:33.410 回答
1

在 2.0.4 版上，typeahead 有问题，不接受函数作为源，只接受数组。我升级到 2.1，它按预期工作。

于 2012-08-26T12:04:36.083 回答