1

我正在尝试实现一个托管在 Google AppEngine (GAE) 上的 jQuery 自动完成搜索栏。我看到一些帖子表明如果我想使用远程源，我必须自己过滤结果。如果我将脚本中的列表存储为数组，如果过滤正确，那么我也尝试将从 GAE 返回的大型服务器端 JSON 数组转换为本地客户端数组，以避免需要手动过滤。两种尝试都没有奏效。

获得过滤的非本地结果的最简单方法是什么（对于 jQuery/.js 初学者）？

这是我尝试使用 jQueryui 文档中提供的正则表达式示例，以及在 SO 上发布的其他示例。如果我在搜索栏中输入“c”，我的下拉列表只会显示并返回字母 c。

GAE .py 代码：

class Search(webapp2.RequestHandler):
    def get(self):
        data = ["chickenpox", "chlamydia", "cholera" ]
        tags = json.dumps(data)
        self.response.out.write(tags)

模板代码：

注意：'/search'指向返回 json 数据的 GAE 服务器处理程序。

<script>
var availableTags = '/search';

$(function() {                          
$( "#autocomplete" ).autocomplete({
    source: function( request, response ) {
            var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
            response( $.grep( availableTags, function( item ){
                return matcher.test( item );
            }) );
        },  
    minLength: 1,
     select: function( event, ui ) {
                $("#user_input").html('Selected: '+ ui.item.value);
                var entry = ui.item.value;
            }
        });
});
</script>

下面是我尝试转换availableTags为本地数组，以便自动完成过滤结果本身。这种黑客/解决方法甚至可能吗？如果不是为什么不呢？

var availableTags = '/search';
var new_local_array = $.parseJSON(availableTags);

我应该尝试哪种方法以及如何尝试？谢谢。

4

1 回答 1

5

在您的代码中，availableTags只包含一个字符串 ( "/search")。您实际上并没有发出 AJAX 请求来取回数据。

如果您不想在服务器上进行过滤，我建议您发出 AJAX 请求来检索信息，然后使用该数据配置自动完成小部件：

$.getJSON('/search', function (data) {
    $("#autocomplete").autocomplete({
        source: data,
        minLength: 1,
        select: function (event, ui) { ... }
    });
});

基本上我们在这里所做的是向服务器询问可能匹配的数组。当我们得到那个数组时，我们用它初始化自动完成小部件。这将允许小部件为我们完成所有过滤。

于 2012-12-27T19:46:28.997 回答