我如何告诉 jquery 自动完成每行显示一个项目而不是在一行中显示整个 return 值？

Question

我正在使用 Rails 5 和 JQuery UI 的自动完成功能。我正在使用 AJAX 为我的文本框获取适当的建议...

$(function() {
  return $('#s').autocomplete({
    source: function (request, response) {
        $.get("/people/search.js", {
            s: request.term
        }, function (responseStr) {
            data = eval(responseStr);
            // assuming data is a JavaScript array such as
            // [{"value": "SpongeyB", "label": "some label" }, {"value": "SpongeyB", "label": "some label" }...]
            // and not a string
            var jsonData = new Array();
            data.forEach(function (item) {
              var jsonItem = new Object();
              jsonItem.value = item;
              jsonItem.label = item;
              var myString = JSON.stringify(jsonItem);
              jsonData.push( myString );
            });
            response(jsonData);
        });
    }
  });
});

但是，当我键入内容时，出现在我的文本框下方的不是选项列表，而是作为字符串的整个 jsonData ...

如何让自动完成功能显示 JSON 列表中的每一项而不是整个 JSON 字符串？

编辑： 为响应给出的答案，我更改了行

jsonData.push( myString );

到

jsonData.push( jsonItem );

但我仍然只得到一行，其中包含出现在我的文本框下方的所有项目...

Answer 1

根据 source under function 下的 docs （这就是你正在做的）：

(data) can be in any of the formats described above for simple local data.

简单的本地数据状态：

There are two supported formats:

An array of strings: [ "Choice1", "Choice2" ]

An array of objects with label and value properties: [ { label: "Choice1", value: "value1" }, ... ]

这些你都没有做。

经过下面的讨论，结果是服务器的响应是一个代表字符串数组的字符串。

正在做：

$(function() {
  return $('#s').autocomplete({
    source: function (request, response) {
        $.get("/people/search.js", {
            s: request.term
        }, function (responseStr) {
            data = JSON.parse(responseStr);
            response(data);
        });
    }
  });
});

成功了。

我如何告诉 jquery 自动完成每行显示一个项目而不是在一行中显示整个 return 值？

How do I tell jquery autocomplete to display one item per line instead of the entire return value in one line?

jquery

jquery-ui

autocomplete

ruby-on-rails

jquery-ui-autocomplete