Non riesco a far funzionare Isotope con AJAX (esempi di codice)

Sto cercando di integrare l’isotopo, ma Iam ha problemi a farlo funzionare con ajax.

Ecco il codice:

 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 = "loading..."; //$("#genreFilter").change(function(){$container.isotope('insert', ajax_load).load(getUrl, getQuery);}); $("#genreFilter").change(function(){$('#movieBox').html(ajax_load).load(getUrl, getQuery);}); }); 

HTML è solo “”

Con la linea isotopica commentata, in realtà ho visto i div visualizzati come attesi, ma dal momento che non riesco a capire come lavorare nella linea isotopica non riesco a farlo funzionare.

Sto cercando di integrare l’isotopo con il metodo “insert” che ho avuto modo di lavorare senza ajax.

Estratto da: http://isotope.metafizzy.co/docs/adding-items.html


“inserisci metodo

Più probabilmente, si desidera utilizzare il metodo insert, che fa tutto ciò che manca ad addItems. insert aggiungerà il contenuto al contenitore, filtrerà il nuovo contenuto, ordinerà tutto il contenuto, quindi innescherà un reLayout in modo che tutti gli elementi dell’elemento siano disposti correttamente.

 var $newItems = $('
'); $('#container').isotope( 'insert', $newItems );

L’ultima riga è ciò di cui ho bisogno per integrarmi con la linea ajax, ma non vedo dove potrei posizionarla. Ho provato alcuni metodi uno dei quali è mostrato nella riga commentata.

Qualcuno può vedere il problema?

Ho capito che funziona così:

 $(function(){ var $container = $('#movieBox'); $container.isotope({ itemSelector: '.movie' }); $.ajaxSetup({cache:false}); var ajax_load = "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)} }); }); });