使用ajax请求作为源数据的JQuery自动完成

时间:2014-11-21 01:17:21

标签: javascript jquery json curl autocomplete

我想做什么:

我想使用jquery自动完成功能执行输入文本字段,该功能从跨域curl请求获取源数据。结果应该类似于:http://abload.de/img/jquerydblf5.png(所以我实际上想要显示我从curl请求获得的其他信息)。获取源数据的URL是http://www.futhead.com/15/players/search/quick/?term=,最后我添加了当前在输入字段中输入的字母(例如“Ronaldo”)。

目前我只尝试执行searchrequest而不显示所有信息,如上面的屏幕所示。我只想看看我实际上通过卷曲请求找回了哪些玩家名字。稍后我会尝试为下拉列表添加更多信息。也许你们也可以帮我这个(我认为它叫做自定义renderItem ??)。

这就是我尝试过的:

<script>
 $( "#tags" ).autocomplete({
    source: function (request, response) {
        $.ajax({
            type: 'GET',
            url: 'playerscraper.php',
            dataType: "json",
            data: function () { 
                return $("#results").val() 
            },
            success: function (data) {
                // I have no idea what this response and map is good for
                response($.map(data, function (item) {
                    return {
                        label: item.label,
                        id: item.value,
                    };
                }));
            },
        });
    }
});
</script>

<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>

我的playerscraper.php正在执行curl请求并实际返回一个数组(使用echo测试):

$term = $_GET['term'];
$curlRequest = new CurlRequest(); 
$result = $curlRequest->get('http://www.futhead.com/15/players/search/quick/?term=' . $searchterm);
$players = array();

return json_encode($result);

我的问题:

我不知道如何以这种方式为自动完成功能执行源部分,我从输入字段中使用myterm从ajax请求中获得了正确的结果。当我在输入字段中输入内容时,没有任何反应(定义源的函数被调用 - 使用警报进行测试)。

0 个答案:

没有答案