0

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>
Adam Seabridge
  • 1,909
  • 1
  • 20
  • 27
  • https://gist.github.com/2406934.js?file=check-jquery-load, that doesnt look like JSON to me – Johan Apr 18 '12 at 21:18

2 Answers2

1

That URL is not returning valid JSON.

From the jQuery Documentation:

Important: As of jQuery 1.4, if the JSON file contains a syntax error, the request will usually fail silently. Avoid frequent hand-editing of JSON data for this reason. JSON is a data-interchange format with syntax rules that are stricter than those of JavaScript's object literal notation. For example, all strings represented in JSON, whether they are properties or values, must be enclosed in double-quotes. For details on the JSON format, see http://json.org/.

Erikk Ross
  • 2,173
  • 13
  • 18
  • oh...I thought it might be possible to access non-json data like this. I guess I need to go down the route of a proxy then instead? – Adam Seabridge Apr 18 '12 at 21:28
  • Here is a similar question/answer to what you are looking for: http://stackoverflow.com/questions/1292486/why-cant-i-load-an-external-resource-from-jquery-load-method – Erikk Ross Apr 18 '12 at 21:37
  • 1
    Here is another answer with some jQuery plugins that will allow you to do a cross-domain load: http://stackoverflow.com/questions/5320511/how-do-you-get-content-from-another-domain-with-load – Erikk Ross Apr 18 '12 at 21:39
1

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

Dennis Rongo
  • 4,611
  • 1
  • 25
  • 25
  • Thanks for the Solution Dennis. before you wrote this I re-worked my code to use fancybox to load the gist embeded code into an iframe by passing the gist id and filename in the querystring to the page loaded in the fancybox iframe. If I decided to re-work this though this looks like a great option too. – Adam Seabridge Apr 18 '12 at 23:22