Isotope .ajax() не работает

Question

Я ценю любую помощь, которую вы можете мне дать.

Я прокомментировал, что я делаю бесконечный прокрутку через php и ajax foreach для загрузки той части страницы, которая мне нужна, единственная деталь - это использование изотопа, и когда я пытаюсь загрузить новое содержимое в изотопе в функция sucess ajax, не загружайте ничего, код выше вызова, если контент загружается правильно, но не внутри изотопа.

Это содержание Еогеаспа

<ul class="projects_wrapper"> 
      <?php if(isset($feed['gallery']['data'])) { ?> 
      <?php foreach($feed['gallery']['data'] as $k=>$v){ ?> 
        <li class="mix <?php echo strtolower($v['parent']['title']); ?>"> 
         <div class="project_item"> 
          <img class="project_item_img" src="<?php echo $v['logo']['src-s'];?>" alt=""> 
          <div class="project_item_description"> 
           <h3 class="project_item_title"><?php echo $v['title']; ?></h3> 
           <p><?php echo $v['description'];?></p> 
           <a class="button button_view button_project" href="/<?php echo $v['permalink'];?>">View More</a> 
          </div> 
         </div> 
        </li> 
      <?php } ?> 
     <?php } ?> 
     <div id="loadmoreajaxloader" style="display:none;"><center><img src="http://www.iec.ch/img/loading_sliders_2.gif" /></center></div> 
     </ul> 

Это содержание для JavaScript

var $isotope_container = $('.projects_wrapper'); 
    var current = 2; 
    var catg = 'all'; 
    $(document).ready(function(){  
    setTimeout(function(){ 
     $isotope_container.isotope({ 
     itemSelector: '.mix' 
     }); 
    },1000); 
     // bind filter button click 
    $('.filter-link').on('click', function() { 
     catg = $(this).data('filter'); 
     $(".mix").filter(catg).css("background-color", "red"); 
     $('.filter-link').removeClass('selected'); 
     $(this).addClass('selected'); 
     var filterValue = $(this).attr('data-filter'); 
     //use filterFn if matches value 
     //filterValue = filterFns[ filterValue ] || filterValue; 
     $isotope_container.isotope({ filter: filterValue }); 
     }); 
     /*$('.add_more').on('click',function(){ 
      var elems = getItemElement().add(getItemElement()).add(getItemElement()); 
      //console.log(elems); 
      // append elements to container 
      $isotope_container.append(elems).isotope('appended',elems); 
     });*/ 
     $(window).scroll(function() 
      { 
       if($(window).scrollTop() == $(document).height() - $(window).height()) 
       { 
        $('div#loadmoreajaxloader').show(); 
        $.ajax({ 
        url: "/projects", 
        data: {pag: current, content_only: 1, category: catg}, 
        success: function(data) 
        { 
         if(data) 
         { 
          //$(".projects_wrapper").append(data); 
          $(".projects_wrapper").isotope("appended",data); 
          $('div#loadmoreajaxloader').hide(); 
          current++; 
          console.log('Me Ejecuto'); 
         }else 
         { 
          $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>'); 
          console.log('Termine'); 
         } 
        } 
        }); 
       } 
      }); 
     }); 

Answer 1

я решить эту проблему для уничтожения изотопа и восстановить после, как это:

function redo_isotope(){ 
     $isotope_container.isotope('destroy'); 
     $isotope_container.isotope({ 
     itemSelector: '.mix' 
     },1000); 
    } 

    var $isotope_container = $('.projects_wrapper'); 
    var current = 2; 
    var catg = 'all'; 
    $(document).ready(function(){  
    setTimeout(function(){ 
     $isotope_container.isotope({ 
     itemSelector: '.mix' 
     }); 
    },1000); 
     // bind filter button click 
    $('.filter-link').on('click', function() { 
     catg = $(this).data('filter'); 
     $(".mix").filter(catg).css("background-color", "red"); 
     $('.filter-link').removeClass('selected'); 
     $(this).addClass('selected'); 
     var filterValue = $(this).attr('data-filter'); 
     //use filterFn if matches value 
     //filterValue = filterFns[ filterValue ] || filterValue; 
     $isotope_container.isotope({ filter: filterValue }); 
     }); 
     /*$('.add_more').on('click',function(){ 
      var elems = getItemElement().add(getItemElement()).add(getItemElement()); 
      //console.log(elems); 
      // append elements to container 
      $isotope_container.append(elems).isotope('appended',elems); 
     });*/ 
     $(window).scroll(function() 
      { 
       if($(window).scrollTop() == $(document).height() - $(window).height()) 
       { 
        $('div#loadmoreajaxloader').show(); 
        $.ajax({ 
        url: "/projects", 
        method: "get", 
        data: {pag: current, content_only: 1, category: catg}, 
        success: function(data) 
        { 
         if(data) 
         { 
          $(".projects_wrapper").append(data); 
          redo_isotope(); 
          //$(".projects_wrapper").append(data); 

          $('div#loadmoreajaxloader').hide(); 
          current++; 
         }else 
         { 
          $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>'); 
         } 
        } 
        }); 
       } 
      }); 
    });