0

The problem is that the page is loaded before the Facebook API is ready. And if the user click on the Facebook connect button, the variable FB is not defined.

At the moment, I load Facebook API on document.ready.

I found a workaround with triggering a custom event.

Is it a good solution to load Facebook API in mobileinit event ? It will load before all others scripts and only once ?

Code :

$(document).on("mobileinit", function(){
  $.ajaxSetup({ cache: true });
    $.getScript('//connect.facebook.net/en_US/all.js', function(){
        window.fbAsyncInit = function() {
            FB.init({
                appId: 'appid',
                channelUrl: 'channel.html',
                //status: true,
                cookie: true,
                xfbml: true
            });
            $(document).trigger("facebook:ready");
        }
    });
});

Thanks for your answers

bidou88
  • 694
  • 2
  • 8
  • 31

1 Answers1

0

The application that you are building using jQuery-Mobile (JQM) is a single-page-application.

"$(document).ready" will only be fired once before the first JQM page is load. You can load the FB lib in "$(document).ready".

From this post, it is more complaining about "$(document).ready" only being fired once and in your case, you can take advantage of it instead.

Community
  • 1
  • 1
Ming Chan
  • 1,938
  • 11
  • 21