-2

I am brand new to jQuery.ajax so please bear with me. I am trying to create a form that validates addresses against a public api, data.citycofchicago.org. If I hit the URL (http://data.cityofchicago.org/api/views/i6bp-fvbx/rows/1478.json) directly, I see the json formatted page. However, I don't seem to be getting a response using ajax. Here is my code:

<script LANGUAGE="JavaScript" SRC="/scripts/jquery-1.7.1.js"></script>
<script type="text/javascript">
$('document').ready(function(){
    $('#button').click(function(){
        $.ajax({
            type: 'get',
            url: 'http://data.cityofchicago.org/api/views/i6bp-fvbx/rows/1478.json',
            success: function() {
                    alert('Got a response!');
                }
        });
    });
});

If I change the URL to an internal page on my site, I see the alert box. When I use this URL, I get no response box. I've tried setting the datatype to json and jsonp but nothing. Any ideas?

Thanks.

Progger
  • 2,266
  • 4
  • 27
  • 51

2 Answers2

1

You can't just specify dataType: jsonp and expect everything to work. What that does is makes jQuery take care of the client-side portion of the AJAX call, but you'll still need to adjust the server-side portion to accomodate JSONP.

Basically, when you specify JSONP, jQuery automatically sends a callback parameter with a randomly generated value such as "jQuery4857439875349_489437589374." What you need to do in your server-side code is wrap the returned data in the specified callback, like this:

echo $_GET['callback']."(".json_encode($arr).")";
jeff
  • 8,300
  • 2
  • 31
  • 43
0

Ajax Cross Domain requests are not supported by browsers in order to stop XSS, or malicious scripting on your website. You can only use Ajax on internal pages. This applies to separate subdomains as well. Hope that helps.

Kpower
  • 1,237
  • 3
  • 11
  • 19