Loading Facebook fb:profile-pic via AJAX in Facebook Connect site
- by mbrevoort
After a page loads, I'm making an AJAX request to pull down an HTML chunk that contains tags representing a Facebook user profile picture. I append the result to a point in the DOM but the logos don't load, instead all I see is the default silhouette.
Here's simply how I'm loading the HTML chunk with jQuery
$.ajax({
url: "/facebookprofiles"
success: function(result) {
$('#profiles').append(result);
}
});
The HTML that I'm appending is a list of diffs like this:
<div class="status Accepted">
<fb:profile-pic class="image" facebook-logo="true" linked="true" size="square" uid="1796055648"></fb:profile-pic>
<p>
<strong>Corona Kingsly</strong>My Status Update<br/>
<span style="font-size: 0.8em">52 minutes ago</span>
</p>
</div>
Any ideas? I assume the fb tags are not being processed once the dom is loaded. Is there any way to make that happen? I'm not seeing any exceptions or errors in my Firebug console.
Thanks