我想做的事:
我想用一个jQuery自动完成功能来做一个输入文本字段,它从跨域curl请求中获取源数据。结果应该完全类似于此示例(此处的CSS不重要):http : //abload.de/img/jquerydblf5.png(因此,我实际上想显示从curl请求中获得的其他信息)。获取源数据的URL是http://www.futhead.com/15/players/search/quick/?term=
,最后添加我在输入字段中当前键入的那些字母(例如“ Ronaldo”)。
目前,我只尝试执行searchrequest,而没有在下拉菜单中显示所有信息,如上面的屏幕所示。我只想查看curl请求实际上返回了哪些球员名称。稍后,我将尝试为下拉菜单添加更多信息。也许你们也可以为我提供帮助(我认为它称为自定义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);
我的问题:
我不知道如何用这种方式来完成自动完成功能的源代码部分,即从ajax请求中获得正确的结果,并在输入字段中输入searchterm。当我在输入字段中键入内容时,什么也没发生(定义源的函数被调用-经过警报测试)。
首先尝试在您的帮助下解决问题(当前代码):
<script>
$( "#tags" ).autocomplete({
source: function (request, response) {
$.ajax({
type: 'GET',
url: 'playerscraper.php',
dataType: "json",
data: function () {
term: request.term
},
success: function (data) {
// I have no idea what this response and map is good for
response($.map(data, function(item) {
return {
label: item.full_name,
value: item.player_id
};
}));
},
});
},
minLength: 3,
delay: 500
});
</script>
JSON的格式与自动填充小部件期望的格式不兼容。这就是$.map
发挥作用的地方。您可以使用此功能将JSON转换为所需的格式。首先返回这样的{label: "display name", value: "some id"}
对:
response($.map(data, function(item) {
return {
label: item.full_name,
value: item.player_id
};
}));
笔记:
header("Content-Type: application/json"); echo $result;
request.term
而不是输入元素值作为data
参数:data: { term: request.term }
delay
和minLength
值以减少JSON请求的数量:delay: 500, minLength: 3,
echo
使用JSON而不是使用return
它。远程服务器发送JSON,因此无需再次对其进行json编码。$term = $_GET['term']; $result = file_get_contents('http://www.futhead.com/15/players/search/quick/?term=' . $term); header("Content-Type: application/json"); echo $result;
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句