Question

I created a Facebook app mostly built in jQuery. I need to now check if a user liked a particular page. However, this needs to be added to a jQuery click() function (so if the user clicks on the button, it will give a dialogue stating they cannot continue without liking the page) and effectively stops the script from running.

My entire application uses jQuery, it’s not different pages, so I really need interaction between jQuery and Facebook JSDK but I am not sure how the integration will work. Does anyone have useful resources for me to have a look at? Or perhaps a script 🙂

Answer 1

use this:

$(document).ready(function() {

    window.fbAsyncInit = function() {
        FB.init({
          appId      : 'YOUR_APP_ID', // App ID
          channelURL : '//www.YOUR_DOMAIN.com/channel', // Channel File URL
          status     : true, // check login status
          cookie     : true, // enable cookies to allow the server to access the session
          oauth      : true, // enable OAuth 2.0
          xfbml      : true  // parse XFBML
        });

        FB.getLoginStatus(function(response) {
              if (response.authResponse) {
                // logged in and connected user, someone you know
                 var user_id = response.authResponse.userID;
                  var page_id = "YOUR_PAGE_ID";
                  var fql_query = "SELECT uid FROM page_fan WHERE page_id = "+page_id+"and uid="+user_id;
                  var the_query = FB.Data.query(fql_query);

                  the_query.wait(function(rows) {

                      if (rows.length == 1 && rows[0].uid == user_id) {
                          //user likes the page
                          //do your stuff here
                      } else {
                        // user doesn't like our page yet                             
                      }
                  });
              } else {
                // no user session available, someone not known, not logged into fb                  
              }
          });
      };

      // Load the SDK Asynchronously
      (function(d){
         var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
         js = d.createElement('script'); js.id = id; js.async = true;
         js.src = "//connect.facebook.net/en_US/all.js";
         d.getElementsByTagName('head')[0].appendChild(js);
       }(document));
});

And in your html/jsp/php, add this line:

<div id="fb-root"></div>

Channel file is not mandatory but advisable. Check fb docs for more info.