Search code examples
javascriptfacebookfacebook-javascript-sdkfacebook-login

Facebook login button onlogin="function" gives ReferenceError

By this far I've managed to implement a facebook login button on my page. The login works well, but I'd like to call a function in my login.js code when the login has succeeded.

Im using the onlogin from This link that will trigger my userLogin() function.

My problem is that when I'm logging in to the application I get this ReferenceError:

[ReferenceError: userLogin is not defined --- sdk.js:1:1]

I have no clue why I got this error.

All of my javascript code is placed in a .js file and included at the top of .

Relevant code:

userLogin() which is placed in $(document).ready(function() {...});

// This function is called when someone finishes with the Login Button.
function userLogin () {
    console.log("it worked");
    FB.getLoginStatus(function(response) {
        statusChangeCallback(response);

    });

}

HTML-code, button that will trigger the function:

<body>
 <div id="fb-root"></div>
  <script src="login.js" type="text/javascript"></script>

  <div class="loginButton">
    <fb:login-button scope="public_profile,email" onlogin="userLogin();">
</fb:login-button>

  </div>
Solution

  • Your function is defined within the scope of $(document).ready(), and not outside.

    To make it available globally, you can do this in your login.js: 

    var userLogin;

$(document).ready(function(){
    userLogin = function(){ /* ... */ };
});

    Note: userLogin is a name that could interfere with another library that might use the same name if it is defined globally. To avoid that kind of problems, I'd advise you to give it a more "custom" name, like myUserLogin.