同位素数据过滤不过滤

Question

我想有一个可以动态更新的过滤器：

我用同位素的JavaScript在外部脚本文件：

var $container = $('.isotope'); 
    // initialize isotope 
    $container.isotope({ 
     // options... 
    }); 

    // filter items when filter link is clicked 
    $('.filter a').click(function(){ 
     var selector = $(this).attr('data-filter'); 
     $container.isotope({ filter: selector }); 
     $('.filter a.active').removeClass('active'); 
     $(this).addClass('active'); 
     return false; 
    }); 

我的过滤器链接：

<ul class="filter clearfix" id="filterContainer"> 
    <li><a href="#" class="active" data-filter="*">All</a></li> 
</ul> 

第一个环节“全部”的作品，但是当我试图使用AJAX来添加更多的链接到它的问题就来了：

function getFilterHtml() { 
     $.ajax({ 
      type: "POST", 
      url: "Default.aspx/getFilterHtml", 
      data: "{}", 
      contentType: "application/json", 
      dataType: "json", 
      success: function (msg) { 
       // Replace the div's content with the page method's return. 
       //$("#filterContainer").html(msg.d); 
       var $newItems = $(msg.d); 
       $('#filterContainer').append($newItems).isotope('addItems', $newItems).isotope('reLayout', callback).isotope('reloadItems'); 
      } 
     }); 
    } 

回调后，这就是它的样子。除了当按下手机部门，它带给我的页面”

<ul id="filterContainer" class="filter clearfix"> 
     <li> 
      <a class="active" data-filter="*" href="#">All</a> 
     </li> 
     <li> 
      <a data-filter=".PhoneDepartment" href="#">Phone Department</a> 
     </li> 
    </ul> 

Answer 1

我使用此代码做同样的事情的顶部：

$('#filterContainer').append($newItems).isotope('insert', $newItems); 

没有重新布局/ reloadItems