2

i am loading post-previews via Ajax. In every post i have a Facebook comments section, counting comments.

The problem is that during the Ajax call the Facebook SDK stops counting the comments amount.

I tried different code examples from Stack like: FB.XFBML.parse(); and 

var $element = $(".fb-comments-count") // you can specify your selector here
$element.removeClass("fb-comments-count") // prevent fb from wrongly set this value
var url = $element.attr("data-href")
$.ajax({
    url: 'https://graph.facebook.com/?ids=' + url,
    type: 'POST',
    dataType: "jsonp",
    success: function (data) {
        $element.html(data[url].comments);
    }
});

I can't figure it. Here is my Code.

$(".loadMore").click(loadMorePosts);

function loadMorePosts() {
  var _this = this;
  var $blogContainer = $("#blogContainer");
  var nextPage = parseInt($blogContainer.attr("data-page")) + 1;
  var totalPages = parseInt($blogContainer.attr("data-totalPages"));

  // Ajax Call for new Posts
  setTimeout(function () {

    $.get("/blog/page" + nextPage, function (data) {
      var htmlData = $.parseHTML(data);
      var $articles = $(htmlData).find(".preview").addClass('fadeIn');

      $blogContainer.attr("data-page", nextPage).append($articles);

      if ($blogContainer.attr("data-totalPages") == nextPage) {
        $(".loadMore").remove();
      }
    });
  }, 0);
}

Thanks for help...

UPDATE

Problem Solved !!

The comment of CBroe did it, i just had to add FB.XFBML.parse(); after appending the new Post (data) via $articles. No need to replace the data-href element completely. Works now like charm, thanks a lot.

  • You need to call FB.XFBML.parse, but you will also have to call it on a “fresh” element, or remove all the indicators on the existing one that this has already been parsed. (The SDK sets classes/data properties to that effect.) I recommend you replace the element completely, instead of just setting data-href - and then call the parse method. – CBroe Sep 12 '17 at 07:05

0 Answers0