Fixing a Javascript error with the Facebook API

Posted on April 21, 2011

I was recently asked to implement a comments section using the Facebook API. In general Facebook makes it really easy to do this with only a few lines of Javascript. When I tried to use their comment counting as well, though, I got this error:

this._count.value is undefined

So I looked into it a bit more, and it turns out that the issue is when the Facebook API is called multiple times on the same page. Consider how you initialize the API:

<p style="padding-left: 30px;"><div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#appId=APP_ID&amp;amp;xfbml=1"></script></p>

By using this multiple times on one page, the ID “fb-root” is included multiple times – so when the Javascript fires, it has an issue with populating the ID, and its behavior becomes erratic. If you happen to find yourself in this situation – either by getting that Javascript error, or by having <fb:comments-count> not working, try searching through your code and make sure that fb-root exists only once.

4 responses to “Fixing a Javascript error with the Facebook API”

  1. Luke says:

    Hey,

    I’m having the same issue and only have fb-root in there once…

    Did you manage to figure out any other causes?

    Thanks,

    –d

  2. greg says:

    I didn’t, no. I assume you also checked that you’re only including all.js once in the page as well?

  3. Leonardo says:

    Hi, here I did not have the rb-root twice, but I had FB.init.
    Once I removed FB.init, the page worked well.

    Thank you! 🙂

  4. Ben Swinburne says:

    Another reason I’ve found which causes this is to do with

    If you specify the ‘href’ attribute like , the href attribute must contain a valid URL.

    I output /path-to-page by accident in the href attribute which caused the issue. Replacing it with http://www.mysite.com/path-to-page resolved it.

    Ben

Leave a Reply

Your email address will not be published. Required fields are marked *