Search code examples
phpjqueryfacebookjquery-uixfbml

Problem with jQuery load() and Facebook XFBML

The situation

I open a layer (jQueryUI) like this.

$("#dialog").load('userinfo.html #layer').dialog('open');

userinfo.html displays the photo and the name of a facebook user.

  <html xmlns:fb="http://www.facebook.com/2008/fbml">
    <...some code...>
    <div id="layer">
      <script type="text/javascript">
        $(function() {   
        FB.init("2342342423424", "http://www.mysite.com/xd_receiver.htm");  
        });
      </script>  
      <fb:profile-pic uid="200000999530485" size="square" linked="true"></fb:profile-pic> <fb:name uid="200000999530485"></fb:name>
     </div>
   <...some code...>
</html>

The problem:

The layer opens but the fbml tags are not rendered! Please help. I think load() doenst load the js-part.

(If i open the userinfo.html in the browser everything works finde)

Solution

  • I think this should work:

    $("#dialog").load('userinfo.html #layer', function() {
  FB.XFBML.parse(document.getElementById('dialog'));
});
$("#dialog").dialog('open');

    Notice that it's being called in the load callback in order to ensure the Ajax request has completed and the data has been loaded before the XFBML parsing has been triggered.