What is the proper way to get autocomplete working with remote data? I read the document at
http://docs.jquery.com/Plugins/Autocomplete
and ran the example code. The example worked just fine for local data stored in a JS array, but when I used a remote URL, it doesn’t work. I see the autocomplete HTTP request being generated, and I can see my local web server responding with the correct data. But the autocomplete info does not pop up.
Here is my .html code, it is only different by 2 lines from the example in the jquery documentation:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/demo/main.css" type="text/css" />
<link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.css" type="text/css" />
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.bgiframe.min.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script>
<script>
$(document).ready(function(){
url = "http://localhost:8000/autocomplete/"
$("#example").autocomplete(url);
});
</script>
</head>
<body>
API Reference: <input id="example" /> (try "C" or "E")
</body>
</html>
Is there anything else needed in the .htm file? Should I change the data format returned by the server? Currently when I type “fr” into the text box, my server returns this:
["fractal","FRACTAL","fractalzebra","frad","Fraet",]
I am just trying to display a simple list of strings, I don’t need to include any additional data in the server response unless it turns out to be required by jquery.
Thanks in advance, this problem has really been stumping me.
-Travis
Make sure you’re also not running into the Same Origin Policy issue which, prior to jQuery 1.5, required all different origin domain ajax calls to be jsonp, and now are implementable with crossDomain:true. As far as the Autocomplete plugin goes, I’m not aware how it fetches the data so this might not be applicable, but what you said about the local version working and the remote data not made me think of this immediately.