Using an FB.Api within another FB.Api

Question

Using an FB.Api within another FB.Api

Navigation

#1 by (1 votes)

0

I am making a function to make a list with 10 facebook friends with 10 posts (status) each. The code below performs searches accurately, however the "friend" + id div does not receive content in the line divFriendsPost.innerHTML = friendPosts, even though the content is correct.

JS

FB.api('/me/friends?limit=10', function(fResponse) {
    console.dir(fResponse);
    var divFriendsList = document.getElementById('friendsList');
    var friend_data = fResponse.data.sort(sortMethod);
    var newLine = '';
    for(var i = 0; i < friend_data.length; i++) {
        newLine += '<p>';
        newLine += '<img src="https://graph.facebook.com/'+friend_data[i].id+'/picture">';
        newLine += '<em>' + friend_data[i].name + '</em>';
        newLine += '</p>';
        newLine += '<div id="friend' + friend_data[i].id + '" class="friendPosts"></div>';

        FB.api({method: 'fql.query', query: 'SELECT message FROM status WHERE uid = ' + friend_data[i].id + ' LIMIT 10'},
            function(posts){
                var divFriendsPost = document.getElementById('friend' + friend_data[i].id);
                var friendPosts = '';
                for(var j=0; j < posts.length ; j++) {
                    friendPosts += '<p>' + posts[j].message + '</p>';
                }
                divFriendsPost.innerHTML = friendPosts;
            }
    );
    }
    divFriendsList.innerHTML = newLine;
});

From what I read, it has to do with the asynchronous request. How do I resolve this?

javascript facebook-graph-api

asked by anonymous 07.02.2014 / 16:24

1 answer

ssh command is not recognized in shell when called by Run command via vba PHP and Javascript - Responsive site - Problems with SELECT and INPUT

score 1 · Accepted Answer

What happens is that the divs are not yet in the gift when you do the "document.getElementById ('friend' ...") and with that the var divFriendsPost is empty. So if you insert the newline inside the for something like:

FB.api('/me/friends?limit=10', function(fResponse) {
    console.dir(fResponse);
    var divFriendsList = document.getElementById('friendsList');
    var friend_data = fResponse.data.sort(sortMethod);
    for(var i = 0; i < friend_data.length; i++) {
        var newNode = document.createElement('div');
        var newLine = '<p>';
        newLine += '<img src="https://graph.facebook.com/'+friend_data[i].id+'/picture">';
        newLine += '<em>' + friend_data[i].name + '</em>';
        newLine += '</p>';
        newLine += '<div id="friend' + friend_data[i].id + '" class="friendPosts"></div>';
        newNode.innerHTML = newLine;
        divFriendList.appendChild(newNode);
        FB.api({method: 'fql.query', query: 'SELECT message FROM status WHERE uid = ' + friend_data[i].id + ' LIMIT 10'},
            function(posts){
                var divFriendsPost = document.getElementById('friend' + friend_data[i].id);
                var friendPosts = '';
                for(var j=0; j < posts.length ; j++) {
                    friendPosts += '<p>' + posts[j].message + '</p>';
                }
                divFriendsPost.innerHTML = friendPosts;
            }
        );
    }
});