So I\'m trying to pull and print just the number of \"likes\" a certain fanpage has, after doing some research - I found that this should work, but its not pulling anything.
Have you tried to call the url by it's ID instead? Also the https / http same protocol applies here. You may need to call the url with document.location.protocol, to match the current protocol of the calling document.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
function fbFetch(){
//Set Url of JSON data from the facebook graph api. make sure callback is set with a '?' to overcome the cross domain problems with JSON
var url = document.location.protocol + "//graph.facebook.com/tenniswarehouse?callback=?";
//Use jQuery getJSON method to fetch the data from the url and then create our unordered list with the relevant data.
$.getJSON(url,function(json){
var html = "<ul>
<li>" + likes + "</li>
</ul>";
//A little animation once fetched
$('.facebookfeed').animate({opacity:0}, 500, function(){
$('.facebookfeed').html(html);
});
$('.facebookfeed').animate({opacity:1}, 500);
});
};
</script>
</head>
<body onload="fbFetch()">
<div class="facebookfeed">
<h2>Loading...</h2>
</div>
</body>
</html>
I get a javascript error in the console. Try to run the function on jquery document ready instead of body onLoad. Also, likes
is not defined, it should be json.likes.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
//Set Url of JSON data from the facebook graph api. make sure callback is set with a '?' to overcome the cross domain problems with JSON
var url = "https://graph.facebook.com/tenniswarehouse?callback=?";
//Use jQuery getJSON method to fetch the data from the url and then create our unordered list with the relevant data.
$.getJSON(url,function(json){
var html = "<ul><li>" + json.likes + "</li></ul>";
//A little animation once fetched
$('.facebookfeed').animate({opacity:0}, 500, function(){
$('.facebookfeed').html(html);
});
$('.facebookfeed').animate({opacity:1}, 500);
});
});
</script>
</head>
<body>
<div class="facebookfeed">
<h2>Loading...</h2>
</div>
</body>
</html>