[Résolu] Ajouter une action à la réponse de l'API Facebook

Bonjour,

Je développe un jeu Facebook en utilisant javascript.
J'utilise l'API de Facebook pour récupérer les amis du joueur loggué.
Pour cela, je fais un appel à l'API Facebook

FB.api('/me/friends',function(response) {/* ma réponse*/});

J'affiche au maximum les 5 premières images reçues dans le code suivant :

FB.api("/me/friends",
          function(response) {
    if (response && !response.error) {
        var nbFriends = Math.min(response.data.length, 5);
        for (var i = 0; i < nbFriends; i++) {
            if (typeof response.data[i] != 'undefined') {
                FB.api('/' + response.data[i].id, {
                    fields: 'id,first_name,picture.width(32).height(32)'
                }, function(response) {
                    if (response && !response.error) {
                        console.log(response);
                        $("#fbfriends").append('<li><img src="' + response.picture.data.url + '" data-fbid="'+response.id+'">' + response.first_name + '</li>');
                    }
                });
            }
        }
    }
}

Je voudrais ajouter une action sur ces <li> une fois la réponse reçue ?

Je ne vois pas comment faire puisque je ne vois pas de méthode à appeler après avoir reçu la réponse.
J'avais essayé de mettre un test

if (i == nbFriends -1) 

mais comme je débute, i vaut 4 pour tous les appels de la boucle .

Je voudrais effectuer une action si on clique sur un joueur (image ou libellé)

$("#fbfriends").on("click",'li',function(e) { 
      challenge(socket.player,$( this ).find('img').attr('data-fbid'),$(this).text());
});

Une piste ? Merci d'avance.[/i][/i]

Bonjour,

$('#friends').on('click', 'li', function(){
 ...
});

devrait fonctionner si '#friends' existe quand tu déclares l'évènement.

Tu peux aussi appeler une fonction après avoir ajouter les nouveaux éléments au dom:

  ... , function(response) {
                    if (response && !response.error) {
                        console.log(response);
                        $("#fbfriends").append('<li><img src="' + response.picture.data.url + '" data-fbid="'+response.id+'">' + response.first_name + '</li>');

  friends_event();                  

}

function friends_event(){
  $('#friends', 'li').unbind().on('click', function(){ 
    // le unbind est là au cas ou la fonction est appelée plusieurs fois et évite qu'un évènement s'exécute plusieurs fois.
    ..
  });
}

Modifié par loicbcn (02 Oct 2015 - 09:35)