Search code examples
jqueryjsonpgithub-apigist

Jsonp is returning response (in firebug net window) but it is not output on page


Here is my working example trying to load a file from github:

<html>
<head><title>Get Gists</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
    var url =  "https://gist.github.com/2406934.js?file=check-jquery-load";
    $.getJSON(url + "?callback=?", null, function(gist) {
        alert(gist);
        $("#gist-info").append(gist);
    });
});
</script>
<div id='gist-info'></div>
</body>
</html>

Solution

  • You pretty much have 2 issues here. Cross-domain and the fact that the fragment that's being returned is not exactly a JSON. It's in between an HTML and a Javascript.

    You definitely need a helper method to parse the returned object since it's performing a document.write().

    See the following link which pretty much solves the same issue that you're having: Loading GitHub Gist

    This is what your Gist looks like in action when put together: Link