I'm trying to get the Geobytes ajax city search to work on my server. I have literally cut n pasted the code from http://www.geobytes.com/free-ajax-cities-jsonp-api.htm but the GetJSON routine doesn't do anything; none of the .done(), .error() .. or even the callback.
I've inserted an .ajax-check, and it tells me there's a timeout error. But when I paste the URL from console.log() into the browser, it works fine. The same URL also works fine through PHP curl server side.
Any idea on what might be wrong?
(Geobytes forum doesn't seem to be maintained, my post never showed up)
Thanks
<script type="text/javascript">
jQuery(function ()
{
jQuery("#f_elem_city").autocomplete({
source: function (request, response) {
console.log("searching for http://gd.geobytes.com/AutoCompleteCity?callback=?&q="+request.term);
$.ajax({
url: "http://gd.geobytes.com/AutoCompleteCity?callback=?&q="+request.term,
dataType: 'json',
timeout: 8000,
success: function( data, string ) { console.log("success"); console.log(string);},
error: function( data, string ) { console.log("error"); console.log(string); }
});
console.log("after ajax");
jQuery.getJSON(
"http://gd.geobytes.com/AutoCompleteCity?callback=?&q="+request.term,
function (data) {
console.log("success");
response(data);
}
);
},
minLength: 3,
select: function (event, ui) {
var selectedObj = ui.item;
jQuery("#f_elem_city").val(selectedObj.value);
return false;
},
open: function () {
jQuery(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function () {
jQuery(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
jQuery("#f_elem_city").autocomplete("option", "delay", 100);
});
</script>
<form action="" method="post" name="form_demo" id="form_demo" enctype="multipart/form-data" onsubmit="return false;">
<p><b>Please enter</b> your city here to see it work. <input class="ff_elem" type="text" name="ff_nm_from[]" value="" id="f_elem_city"/>
</form>
