一尘不染

twitter bootstrap typeahead 2.0.4 Ajax错误

ajax

我有以下代码,如果我使用2.0.0版本,该代码肯定会返回正确的数据结果,但是由于某些原因,bootstrap的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) {
        }
    });

阅读 163

收藏
2020-07-26

共1个答案

一尘不染

1)Bootstrap typeahead v2.0.2解决方案

看一下这个拉取请求,它看起来像您要找的东西(它来自bootstrap
typeahead v2.0.2的fork)。

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

2)Bootstrap typeahead v.2.1.0-进行中解决方案

您也可以尝试此解决方案。我只是更改了项目以使用此项目,因为它将在将来的版本中得到支持,并且看起来更干净:)

就我而言:

$("#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响应(数组):

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

[“ Eminem”,“ Limp Bizkit”,“ Rihanna”,“ Will Smith”]

2020-07-26