jquery-ui - json 数据的自动完成答案

【问题标题】：jquery-ui - Autocomplete for json datajquery-ui - json 数据的自动完成
【发布时间】：2012-05-21 07:25:19
【问题描述】：

我有这种类型的 json 输入。 [ {“id1”：“val1”，“id2”：“val2”}，{“id1”：“val3”，“id2”：“val4”}，...]

如何在 jquery-ui 中提供的自动完成插件中解析这个？基本上我希望与 id1 对应的 val1、val3 等成为我的自动完成文本的一部分。关于如何进行此操作的任何建议？

【问题讨论】：

这是来自远程还是本地数据源？你能显示你的自动完成代码吗？
它来自我从我的 sql 表中准备的本地数据源。实际上，我不想每次用户输入内容时都触发“like”查询。

标签： json jquery-ui

【解决方案1】：

自动完成小部件需要一组简单的字符串值或具有属性label、value 或两者兼有的对象。

您可以使用$.map 实用功能获取您的数据并将其转换为正确的格式。这假设您成功发出 AJAX 请求并且数据正在返回：

$.getJSON("/url", function(data) {
    var src = $.map(function (el) {
        return el.id1;
        // or:
        // return { label: el.id1, value el.id2 };
    });

    $("#id").autocomplete({ 
        source: src
    });
});

示例： http://jsfiddle.net/df6wB/

【讨论】：

谢谢！！它确实奏效了。我还认为数组元素应该有一些映射。感谢您的回答。该链接也很有用:)
@AnkitGarg：太棒了！如果有帮助请Accept the answer。

【解决方案2】：

要将 JSON 字符串转换为 JSON 对象，请使用 $.parseJSON( ... )。这里var jsonstring 是包含 JSON 文本的文本，没有其他内容。如果字符串不是有效的 JSON，parseJSON() 将失败。

var jsonobj = $.parseJSON( jsonstring );

然后使用它来插入new options 以自动完成。

以这种方式从jsonobj 获取值：

alert( jsonobj.id1 ); 
alert( jsonobj.id2 );

【讨论】：

这里的 jsonstring 是我之前文章中定义的一个数组。我正在尝试该数组，但 jsonobj 被返回为 null。对此有任何指示吗？？
如果它已经是对象，那么你不需要$.parseJSON()，你应该在你的问题中添加更多细节以获得更好的答案。 几行源代码胜过千字。
我正在使用这个$(document).ready(function () { var sA = []; $.getJSON("URL to my json object array", function(data) { $.each(data, function (i, val) { sA.push(val.v); }); $("#id").autocomplete( { source : sA, minLength: 2, cache : false });