我正在尝试使用我不太熟悉的Ajax请求填充数组(与jquery-ui元素一起使用)。有两个文件,selectStudents.php,它们将被查看,loadStudents.php是Ajax请求的文件。
当我查看loadStudents.php时,复制输出,并用它替换Ajax请求而不是它完美无缺,所以我只是对我的ajax做错了。任何人都看到它是什么?
<script>
$(function() {
var availableTags = new Array();
new Ajax.Request('includes/loadStudents.php', {
onSuccess : function(xmlHTTP){
eval(mlHTTP.responseText);
}
});
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
谢谢!
答案 0 :(得分:2)
看起来像prototype。如果您使用的是jQuery,则ajax请求如下所示:
$.ajax('includes/loadStudents.php', {
success: function(data) {
// no need to eval, jQuery handles parsing the json for you
console.debug(data);
}
});
有关详细信息,请参阅jQuery.ajax
。
另外使用jQuery UI,你可以让autocomplete为你处理ajax:
$('#tags').autocomplete({
source: 'includes/loadStudents.php'
});
有关进一步用法,请参阅jQuery UI Autocomplete。
答案 1 :(得分:1)
假设Ajax.Request
有效,我的注释中描述了未正确设置数组的原因:Ajax是异步。 .autocomplete
调用在onSuccess
回调运行之前执行(因此在设置数组元素之前)。
您只需将.autocomplete()
调用放在函数内即可解决此问题。但以不同的方式解决问题要好得多:
不要在PHP脚本中返回JavaScript。返回JSON:
<?php
$data = array('Doe, Kid', 'Smith, John');
echo json_encode($data);
?>
然后你的JavaScript看起来像:
$(function() {
$.getJSON('includes/loadStudents.php', function(data)
$( "#tags" ).autocomplete({
source: data
});
});
});
或者@scurker already mentioned,将网址设置为source
。它在documentation:
只需指定源选项,即可自定义自动完成功能以使用各种数据源。数据源可以是:
- 包含本地数据的数组
- 一个String,指定一个URL
- a Callback
(...)
使用String时,Autocomplete插件希望该字符串指向将返回JSON数据的URL资源。它可以位于同一主机上,也可以位于不同的主机上(必须提供JSONP)。请求参数“term”将添加到该URL。数据本身的格式与上述本地数据的格式相同。
因此,为了使其正常工作,您必须返回JSON,如上所示。