No se puede obtener Isotopo para trabajar con AJAX (ejemplos de código)

Question

Estoy tratando de integrar el isótopo pero tengo problemas para hacerlo funcionar con ajax.

Aquí está el código:

<script type="text/javascript"> 

var currentPage = 1; 

$(function(){ 
    var getUrl = 'loadMovies.php'; 
    var getQuery = 'genrefilter='+movieSelection.elements["genreFilter"].value; 
    getQuery += '&yearfilter='+movieSelection.elements["yearFilter"].value; 
    getQuery += '&titlesort='+movieSelection.elements["titleSort"].value; 
    getQuery += '&ratingsort='+movieSelection.elements["ratingSort"].value; 
    getQuery += '&yearsort='+movieSelection.elements["yearSort"].value; 
    getQuery += '&runtimesort='+movieSelection.elements["runtimeSort"].value; 
    getQuery += '&currentPage='+currentPage; 

    var $container = $('#movieBox'); 
    //$container.isotope({itemSelector: '.movie'}); 

    $.ajaxSetup({cache:false}); 
    var ajax_load = "<img class='loading' src='images/load.gif' alt='loading...' />"; 

    //$("#genreFilter").change(function(){$container.isotope('insert', ajax_load).load(getUrl, getQuery);}); 


    $("#genreFilter").change(function(){$('#movieBox').html(ajax_load).load(getUrl, getQuery);}); 
}); 

HTML es simplemente ""

Con la línea de isótopos comentada en realidad llego divs que se muestran como se esperaba, pero ya no puedo encontrar la manera de trabajar en la línea de isótopos no puedo hacer que funcione.

Estoy tratando de integrar el isótopo con el método de "inserción" que llegué a trabajar sin ajax.

Extracto de: http://isotope.metafizzy.co/docs/adding-items.html

---

"método de inserción

Lo más probable es que desea utilizar el método de inserción, que hace todo lo que addItems pierde insertar anexará el contenido en el recipiente, filtro. los nuevos contenidos, más o menos todo el contenido, a continuación, desencadenar una relayout lo que todos los elementos item están correctamente diseñada.

var $newItems = $('<div class="item" /><div class="item" /><div class="item" />'); 
$('#container').isotope('insert', $newItems); 

---

La última línea es lo que necesito para integrar con la línea Ajax pero simplemente no veo dónde podría ubicarla. Intenté algunos métodos, uno de los cuales se muestra en la línea comentada.

¿Alguien puede ver el problema?

Answer 1

tengo que trabajar de esta manera:

$(function(){ 

     var $container = $('#movieBox'); 

     $container.isotope({ 
      itemSelector: '.movie' 
     }); 

     $.ajaxSetup({cache:false}); 
     var ajax_load = "<img class='loading' src='images/load.gif' alt='loading...' />"; 

     $('#genreFilter').change(function(){ 

$('#genreFilter').change(function(){ 

      var getQuery = 'loadMovies.php?'; 
      getQuery += 'genrefilter='+movieSelection.elements["genreFilter"].value; 
      getQuery += '&yearfilter='+movieSelection.elements["yearFilter"].value; 
      getQuery += '&titlesort='+movieSelection.elements["titleSort"].value; 
      getQuery += '&ratingsort='+movieSelection.elements["ratingSort"].value; 
      getQuery += '&yearsort='+movieSelection.elements["yearSort"].value; 
      getQuery += '&runtimesort='+movieSelection.elements["runtimeSort"].value; 
      getQuery += '&currentPage='+currentPage; 

      return $.ajax({ 
       cache:false, 
       url: getQuery, 
       success: function(data){$container.isotope('insert', data)} 
       }); 
      }); 

    });