我可以对自动完成使用jquery ajax响应吗?

时间:2015-02-28 10:31:27

标签: javascript php jquery ajax jquery-autocomplete

现在是凌晨3点。在这个问题上,我一直在撞墙几个小时,只是不明白。

我正在尝试使用来自ajax请求的源数据的jQuery自动完成功能。 Ajax似乎工作得很好,但我似乎无法使用源数据的响应。 匿名函数在就绪时获取数据。 Success调用test(响应)将数据传递给具有自动完成功能的函数。响应看起来与示例代码完全相同。当我从控制台粘贴我的响应时,它完美地运行。但它不会让我使用变量'专辑'作为来源。

$(function(){

    $.ajax({
        dataType: 'text',
        type: 'POST',
        url: '/albums/fetch_albums',
        success: function(response){
            console.log(response); // logs ["Italy","Hawaii"] -as expected
            test(response);
        }
    });

});

function test(data){
    var albums = data;
    console.log(albums);         // logs ["Italy","Hawaii"] - as expected
    console.log(typeof albums);  //logs string - as expected

   $('#autocomplete').autocomplete({
        source: albums,                //this is what I want... errors out.
        //source: ["Italy","Hawaii"] // pasted response if un-commented works fine.
    });
}

以下是错误消息。

 GET http://journal.localhost.com/[%22Italy%22,%22Hawaii%22]?term=h 403 (Forbidden)jquery-2.1.1.min.js:4 n.ajaxTransport.k.cors.a.crossDomain.sendjquery-2.1.1.min.js:4 n.extend.ajaxjquery-ui.min.js:7 e.widget._initSource.e.isArray.string.options.source.sourcejquery-ui.min.js:7 e.widget._searchjquery-ui.min.js:6 (anonymous function)jquery-ui.min.js:7 e.widget.searchjquery-ui.min.js:6 (anonymous function)jquery-ui.min.js:7 (anonymous function)jquery-ui.min.js:6 i

必须有一种从数据库中获取数据并将其提供给此功能的方法。

帮助我Obiwan!

1 个答案:

答案 0 :(得分:1)

$(function(){

$.ajax({
    dataType: 'text',
    type: 'POST',
    url: '/albums/fetch_albums',
    success: function(response){
        console.log(response); // logs ["Italy","Hawaii"] -as expected
        var arrResponse = JSON.parse(response); //convert json object to array 
        test(arrResponse);
    }
});

});