jQuery/ Ajax Sample API call to present data
Hello!
In an effort to start viewing some data using freely available APIs - I wanted to use JavaScript/ Ajax. I found jQuery and want to start using it for the same - then use for more UI manipulations (to present data)..
I found a sample script online that I understood to be a simple script for making a GET call to retrieve data using this API.. It also has the different callbacks implemented so I am able to see the sequence and failures.
There are TWO things I'm trying to fix
1) result of the request is 200 (successful?) but there's an associated error
2) display the response data/ text on the page in the
$('div.demo-container') which is in the same html file
Below are results using Firefox/ HttpFox and Firebug - followed by the script in use.
I'm hoping this is sufficient to point out the problem(s) here - please let me know what I can do to resolve these!
Firefox/ HttpFox output:
Method: GET
Result: 200
Type: text/xml (NS_ERROR_DOM_BAD_URI)
(I see the XML response from this API call in the browser and 'content' section of httpfox.)
Firefox/ Firebug console output:
Request failed: error, undefined,
Request error: error, undefined, ,
- function jQueryCall()
- {
- var request = $.ajax({
- url: "http://api.worldbank.org/source?per_page=50",
- type: "GET",
- dataType: "xml",
- cache: true
-
- });
-
- request.complete(function(jqXHR, textStatus){
- $('div.demo-container').html("Request complete: " + textStatus);
- console.log( "Request complete: " + textStatus );
- });
- request.done(function(jqXHR) {
- console.log(jqXHR);
- $('div.demo-container').html(jqXHR);
- });
-
- request.fail(function(jqXHR, textStatus) {
- console.log( "Request failed: " + textStatus + ', '+
- jqXHR.responseXML + ', ' + jqXHR.responseText );
- });
-
- request.error(function (jqXHR, textStatus, errorThrown){
- console.log( "Request error: " + textStatus + ', ' +
- jqXHR.responseXML + ', ' + jqXHR.responseText + ', ' + errorThrown );
- });
-
- request.success(function (data, textStatus, jqXHR){
- console.log( "Request success: " + data );
- });
- }