3

I am wondering whether it is possible to change the action of a Facebook like button on an Ajax event.

What I am trying to do: I display an article when the page was loaded. At the end of the article I have a button which loads the next article via Ajax. Additional I have the following Facebook like button:

<fb:like href="http://www.myurl.com" layout="standard" show-faces="true" action="like"  id="fblike" />

When I load the next article I put the new URL of the article into the "href"-attribute via Javascript (which works fine), but when I click on the like button the initial article url will be pushed to facebook, and not the new one.

Any ideas?

Thanks a lot.

Nate Totten
  • 8,904
  • 1
  • 35
  • 41
chris
  • 2,109
  • 2
  • 23
  • 33

2 Answers2

6

You don't actually need the iframe version as it is more limited and not as good for performance. All you need to do is use this snippet to re-render the button in the DOM; without a page refresh, the element does not "refresh" otherwise:

FB.XFBML.parse();

See docs here: http://developers.facebook.com/docs/reference/javascript/

A5C1D2H2I1M1N2O1R2T1
  • 190,393
  • 28
  • 405
  • 485
Oliver Foxley
  • 61
  • 1
  • 2
1

You could try the iFrame version instead the XFBML version:

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fexample.com%2Fpage%2Fto%2Flike&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

See here for more infos:

http://developers.facebook.com/docs/reference/plugins/like

Alexis Dufrenoy
  • 11,784
  • 12
  • 82
  • 124