Ajax call to Github API fails

Question

So I'm a little new at this, a the code I have so far is not working yet, but if anyone can tell me what i missing I would be grateful.

Basically, I'm trying to make a call to github's api, which returns json data. I'd eventually like to parse it and display only specific information, but at the present I'm just trying to get the data to show in my browser. Here is what I have so far:

<script type="text/javascript">
$(document).ready(function() {

$.ajax({
    url: "https://api.github.com/repos/VonC/gitolite/git/refs/tags",
    dataType: "jsonp", // I'm under the impression i should use jsonp, since this is a cross domain call
    success: function (returndata)
    {
        $('.result').html(returndata);
        alert('Load was performed.');
      }  
    });
 });
</script>

The url definitely works: when you call it using CURL, the following json data is returned:

[
{
"object": {
  "type": "commit",
  "sha": "9accde83842523e18de320fc2f0a8efeaebef27b",
  "url": "https://api.github.com/repos/jeffreycwitt/jeffswebpage/git/commits/9accde83842523e18de320fc2f0a8efeaebef27b"
 },
"url": "https://api.github.com/repos/jeffreycwitt/jeffswebpage/git/refs/heads/master",
"ref": "refs/heads/master"
 } 
]

Thanks for any advice you can give me.

Ehats the question ? You make a call and you get the json returned ... thats good isn't it ? — NimChimpsky
– NimChimpsky, Commented Jan 17, 2012 at 11:39
dataType: "jasonp" looks a bit wrong. I'm sure Jason P likes being a data type :D — Richard Dalton
– Richard Dalton, Commented Jan 17, 2012 at 11:42
@NimChimpsky - well, it would seem good, except it doesn't work in my browser -- does it work for you? check out my fiddle jsfiddle.net/Geoff16W/JSGnF/2 - let me know if you can make it work. — Jeff
– Jeff, Commented Jan 17, 2012 at 11:46

Tamás · Accepted Answer · 2012-01-17 11:49:52Z

5

dataType should probably be jsonp and not jasonp. Even better, it should simply be json as you are not making a JSONP call.

Another thing you should watch out for is that returndata is going to be the actual, parsed JavaScript object that comes out of the JSON representation, not the JSON object as a string. This means that you cannot put it straight into the .result div.

The following seems to work for me:

$.ajax({
    url: "https://api.github.com/repos/VonC/gitolite/git/refs/tags",
    dataType: "json",
    success: function (returndata)
    {
        $("#result").html(returndata[0]["object"]["sha"]);
        alert('Load was performed.');
    }  
});

edited Jan 17, 2012 at 11:49

answered Jan 17, 2012 at 11:42

Tamás

48.2k12 gold badges107 silver badges125 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Jeff Over a year ago

ahh, yes indeed that is wrong. I'll edit the question. Now the alert fires, but I still don't get any data entering the "div" and showing up in my browser.

Alex Dn Over a year ago

In case data that returned from server is simple text, it can be injected into div directly, otherwise, you must take required text from Javascript object created on base of JSON string that the server returned.

Jeff Over a year ago

tada - it works. Thanks very much. I guess i'm still confused about why I'm not using jsonp -- i thought I was supposed to use this for sites not under the same domain.

Jeff Over a year ago

Any reason this .parseJson shouldn't work:success:

function (returndata)         {          var obj = $.parseJson(returndata);         $(".result").html(obj.type);         alert('Load was performed.');         }        });

Tamás Over a year ago

returndata is already parsed, so you couldn't parse it again.

NimChimpsky · Accepted Answer · 2012-01-17 12:14:29Z

1

the returned data is not html, its a json object you have to reference the fields directly or loop through them.

You can access the data like so (although worth noting that using property name object is rather confusing, it can be any string))

returndata[0].object.sha

(And change jason to json)

edited Jan 17, 2012 at 12:14

answered Jan 17, 2012 at 11:51

NimChimpsky

47.5k61 gold badges202 silver badges320 bronze badges

2 Comments

Jeff Over a year ago

Any reason this .parseJson shouldn't work:

success: function (returndata) {  var obj = $.parseJson(returndata);  $(".result").html(obj.type);  alert('Load was performed.');  }  });

NimChimpsky Over a year ago

@jeff you already have a json object, returndata. Just use that

Collectives™ on Stack Overflow

Ajax call to Github API fails

2 Answers 2

5 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related