如何为 jquery ui 自动完成解析我的 json答案

【问题标题】：How do I parse my json for jquery ui autocomplete如何为 jquery ui 自动完成解析我的 json
【发布时间】：2014-11-07 13:24:37
【问题描述】：

json 是从动态 php 函数返回的，看起来像

 [{"tagid":"1","name":"scandalous"},{"tagid":"2","name":"crime"},{"tagid":"3","name":"entertainment"},{"tagid":"4","name":"finance"}]

文本输入应使用名称字段。自动完成被称为

$(document).on("focus", "#tagfilter", function(event) {
$(this).autocomplete({
source:  "/app/processes/tags.php?f=get_json_tags"
});

});

但我无法让自动完成功能工作

为任何帮助干杯。

【问题讨论】：

标签： jquery json jquery-ui

【解决方案1】：

您可以使用 jQuery map 将您的起始项目数组或对象转换为新的项目数组，而不是使用 grep 应用输入过滤器。

当前过滤器存储在request、source函数参数中。

代码：

$(this).autocomplete({
    source: function (request, response) {
        var re = $.ui.autocomplete.escapeRegex(request.term);
        var matcher = new RegExp("^" + re, "i");
        $.getJSON("/app/processes/tags.php?f=get_json_tags", function (data) {
            response($.grep(($.map(data, function (v, i) {
                return {
                    label: v.name,
                    value: v.name
                };
            })), function (item) {
                return matcher.test(item.value);
            }))
        });
    }
});

【讨论】：

url是怎么传给那个的？
感谢 irvin 让我继续前进 :-)
@BarryHamilton 很高兴为您提供帮助。您需要更多信息吗？

【解决方案2】：

json remote datasource请参考这个例子：

因此，您的代码应该是：

$(this).autocomplete({
    source: function( request, response ) {
        $.ajax({
          url: "/app/processes/tags.php?f=get_json_tags",
          dataType: "jsonp",
          data: {
            q: request.term
          },
          success: function( data ) {
            response( $.map(data, function(v,i) { 
                    return { label: v.name, value:v.name }; 
                 }) 
            );
          }
        });
      }//[,
      //other: "options",
      //may: "be included",
      //right: "here" ]
});

【讨论】：

这并没有真正回答我已经测试过该解决方案的问题，但我不确定我在哪里放置映射以将我返回的响应转换为与自动补全一起使用的响应。
我还在努力。必须使用$.map() 正确映射响应的参数。查看更新。

【解决方案3】：

是否可以从 2 个不同的字段返回值？

例如，现在该示例仅返回“v.name”。有没有办法让自动完成功能更通用，并且如果有人输入匹配的年龄也返回“v.age”？

我不确定如何返回它找到的值。

return { label: v.name, value:v.name }; 
return { label: v.age, value:v.age };

【讨论】：