Question

我正在建立一个使用twitter typeahead的自动完成功能，使用对我的php文件的ajax JSON调用来获取一些数据，但它会在下拉结果列表中显示以下内容：

未定义

但是当我这样做时：

alert(data);

我得到了正确的数据显示，但不知何故，自动完成列表一直显示未定义，我已经阅读并尝试了一些文章在stackoverflow上的一些文章，但我似乎无法让它工作。

我必须遵循jquery代码：

      $('.item-name .typeahead').typeahead(null,{
      source: function (query, process) {
        $.ajax({
          url: 'ajaxItems.php',
          type: 'POST',
          dataType: 'JSON',
          data: 'query=' + query,
          success: function(data) {
            // alert(data);
            process(data);
          }
        });
      }
    });

我的ajaxItems.php具有以下用于测试目的的代码：

<?PHP
$results = array();

$results[] = 'jeans';
$results[] = 'sweater';

$json =  json_encode($results);
print_r($json);
?>

JSON输出如下：

["jeans","sweater"]

我希望有人可以对我做错的事情有所启发，或者指出我正确的方向。先谢谢！

修改的我使用以下typeahead文件： http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js

Answer 1

我遇到了完全相同的问题。要解决这个问题，我必须返回一个包含键/值对的数组，其中包含键值＆＃39;像这样：

[{'value': 'first', 'value': 'second', 'value': 'third'}]

我认为typeahead文档不够明确，但我认为 displayKey 选项设置为＆＃39; value＆＃39;默认情况下。

Answer 2

最接近的答案是伊恩，虽然它不起作用（只返回最后一个值）。工作答案是：

[{'value': 'first'}, {'value': 'second'}, {'value': 'third'}]

Answer 3

我在使用source:时遇到了类似的问题，最后我使用了remote:。在你的情况下，它将是这样的：

$('.item-name .typeahead').typeahead({
    remote: 'ajaxItems.php?query=%QUERY'
  });

请注意，我在null上删除了typeahead(null,{，因为我认为没有必要，但我可能错了。显然，您必须使用$_GET代替$_POST，但我认为这样更容易。

Answer 4

问题是typeahead期待一个包含建议的数组。不是JSON！

像这样使用$.makeArray()：

success: function(data){
     process($.makeArray(data));
}

如果没有，可能是JSON.parse（）应该有帮助吗？

如果有帮助，请将其标记为答案：）

Twitter Typeahead Ajax结果未定义

4 个答案: