I want to execute an ajax call as soon as a document is loaded. What I am doing is loading a string that contains data that I will use for an autocomplete feature. This is what I have done, but it is not calling the servlet.
I have removed the calls to the various JS scripts to make it clearer. I have done several similar AJAX calls in my code but usually triggered by a click event, I am not sure what the syntax for doing it as soon as the document loads, but I thought this would be it (but it’s not):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../js/jquery.js" type="text/javascript">
</script>
<link rel="stylesheet" href="../css/styles.css" type="text/css">
<link rel="stylesheet" href="../css/jquery.autocomplete.css" type="text/css">
<script type="text/javascript" src="../js/jquery.bgiframe.min.js">
</script>
<script type="text/javascript" src="../js/jquery.dimensions.js">
</script>
<script type="text/javascript" src="../js/jquery.autocomplete.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
type: "GET",
url: "AutoComplete",
dataType: 'json',
data: queryString,
success: function(data) {
var dataArray = data;
alert(dataArray);
}
});
$("#example").autocomplete(dataArray);
});
</script>
<title></title>
</head>
<body>
API Reference:
<form><input id="example"> (try "C" or "E")</form>
</body>
</html>
EDIT: my code now looks more like Karim’s:
$(document).ready(function(){
$.ajax({
type: "GET",
url: "../AutoComplete",
success: function(data) {
$("#example").autocomplete(data);
}
});
});
Nonetheless the autocomplete still doesn’t work (admittedly another question altogether, so I will also post another question so it has an appropriate title).
My variable “data” that is being sent back looks like … “Manuscript|Text|Information Object|Basketball|Ball|Sporting Equipment|Tarantula”.split(“|”);
If I do
var dataArray = "Manuscript|Text|Information Object|Basketball|Ball|Sporting Equipment|Tarantula".split("|");
and then
$("#example").autocomplete(dataArray);
It all works fine, but when I get the value of dataArray from the server it doesn’t.
You need to have jQuery loaded before making calls to the jQuery API.
Before your code snippet, load jQuery…