jQuery自动完成功能无法正确显示

时间:2011-02-01 20:01:09

标签: jquery json autocomplete

我正在使用带有JSON的jQuery Autocomplete,但结果数据无法正确显示。如果您转到http://whatsmybeer.com并输入“firestone”,您会得到一个下拉列表,其中显示“Undefined”,其中包含正确的结果数但JSON未正确显示。您可以看到从javascript http://whatsmybeer.com/search.inc.php?beer=firestone&callback=调用的JSON输出示例?

我的JS脚本显示JSON结果。

<script>
    $(document).ready(function() {
        $( "#REMOTE" ).autocomplete({
            source: function( request, response ) {
                url = "search.inc.php?beer=" + request.term;
                $.getJSON(url + '&callback=?', function(data) {
                    response(data);
                });
            }
        });
    });
</script>

解析时我做错了什么?

1 个答案:

答案 0 :(得分:0)

首先,我limit the search result to 10或者其他什么 - 当你试图处理数据显示时,你首先使用thousends或任何数量的啤酒来杀死浏览器。

此外,我将minLength的{​​{1}}选项设置为autocomplete,因为对于服务器端来说,输入一个字母有点过分,好像有人会输入'a'它可能会返回一半数据库(如果您不想包括返回的金额限制)在输入第二个字母后添加自动填充更自然,特别是对于大型数据库。

最重要的是 - 您需要以正确的方式格式化您的JSON响应。

你返回对象:

2

你应该回来:

{ 
    beer_name: "name" 
}

如果标签和值相同,那么它应足以仅提供{ label: "autocomplete display value", value: "input value after selection" } ,您应该能够安全地省略label

中的重复