Dealing With Ajax On FBConnect ...

problem :

need to store users information by ajax call while on connect . but face problems using fbjs ajax calls using on connect .some times face the problem to send ajax request  in the forum also get related type of problems . like:

http://forum.developers.facebook.com/viewtopic.php?id=28153
http://forum.developers.facebook.com/search.php?search_id=92171720

let’s see a quick solution by a common example.

solution:

here we look at the after connect get user profile picture and name by connect.

we create a script connect.php and include the  config  file .connect.php
view plaincopy to clipboardprint?

   1. <?php 
   2. /*
   3. * include config file
   4. */ 
   5. ?> 
   6.  
   7. <div id="user"> </div> 
   8. <fb:login-button onlogin="update_user_box();"></fb:login-button> 
   9. <script type="text/javascript">FB.init("key", "xd_receiver.php"); </script><span style="display: block; padding-left: 6em;"><span> 

<?php
/*
* include config file
*/
?>

<div id="user"> </div>
<fb:login-button onlogin="update_user_box();"></fb:login-button>
<script type="text/javascript">FB.init("key", "xd_receiver.php"); </script><span style="display: block; padding-left: 6em;"><span>

now it’s look like that:

here in the connect button add onlogin function update_user_box().while click on connect then this function will call and update user by profile picture and name in the user id div.

in that update_user_box() function we will get the profile picture and name by calling ajax. So later on we can do anything by ajax.to call the ajax we will do it by jquery. Here I cannot do it by the fbjs  ajax method. For that reason I add jquery and other scripts.
view plaincopy to clipboardprint?

   1. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script> 
   2. <script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>

now update update_user_box
view plaincopy to clipboardprint?

   1. <script type="text/javascript"> 
   2. function update_user_box() 
   3.  
   4. { 
   5.  
   6. Var url = “http://www.t...com.display.php”; // ajax url which is here display.php 
   7.  
   8. $.ajax({ 
   9. type: "POST", 
  10. url:url, 
  11. data: "save=yes", 
  12. success: function(msg){ 
  13. var user_box = document.getElementById("user"); 
  14. user_box.innerHTML =msg; 
  15.  
  16. } 
  17. }); 
  18. } 

<script type="text/javascript">
function update_user_box()

{

Var url = “http://www.t...com.display.php”; // ajax url which is here display.php

$.ajax({
type: "POST",
url:url,
data: "save=yes",
success: function(msg){
var user_box = document.getElementById("user");
user_box.innerHTML =msg;

}
});
}

now create the display.php Which call by ajax.

 Original Source:
http://fbcookbook.ofhas.in/2009/02/11/dealing-with-ajax-on-fbconnect/