Ciao a tutti,
ho creato un effetto di scroll infinito ma ho un piccolo problema..
praticamente ogni volta che raggiungo il bottom della pagina con lo scroll faccio una chiamata ajax ad una query php che mi restituisce altri 10 record dalla tabella in questione..aggiungendoli alla lista della mia pagina..
sembra funzionare correttamente se non fosse che una volta caricata la pagina completamente refreshandola avvengono mille chiamate e alla query non viene passata più la variabile dell'id da incrementare di 10..
quindi una volta passa un valore e la volta dopo invece di passargliene uno decrementato di 10 gli passa lo stesso o addirittura uno più alto..
lo stesso avviene se scrollo troppo velocemente senza aspettare che carichi i 10 record per volta.
qua il codice
nr è la variabile iniziale dato che appena carica la pagina gli dico qual'è l'id più alto dei record della tabella..codice:$(document).ready(function () { var nr = "<?php echo $lastPastId ?>"; loadData( nr ); //Hide Loader for Infinite Scroll $('div.ajaxloader').hide(); }); function loadData ( last_id ) { var $entries = $('#entries'), $loader = $('.ajaxloader', $entries).show(); $.get( 'getentries.php', { last_id : last_id }, function( data ) { $entries.append( data ).append( $loader.hide() ); }); }; $(window).scroll(function () { if ($(window).scrollTop() >= $(document).height() - $(window).height()) { $('div.ajaxloader').show('slow'); loadData( $("#entries .singleRecord:last").attr('id') ); //alert( $("#entries .singleRecord:last").attr('id') ); } });
Con la funzione di scroll determino l'id dell'ultimo div con classe singleRecord e lo passo alla funzione loadData che a sua volta lo passa alla query php in getentries.php che ha il compito di estrarre i 10 record successivi all'id passato last_id...
ovviamente nella mia pagina ho i due div.. entries che accoglie i record e ajaxloader che viene visualizzato e nascosto in base alle funzioniCodice PHP:<?php
//Connect to Database
$con = new mysqli( 'localhost', 'root', 'root', 'dbname' );
if( $con->connect_errno ) {
die( 'Could not connect:' . $con->connect_error );
}
$id = isset( $_GET['lastPastId'] );
$last_id = isset( $_GET['last_id'] ) ? (int)$_GET['last_id'] : $id;
echo $last_id;
$stmt = $con->prepare( 'SELECT id,nome FROM table WHERE id < (?) ORDER BY id DESC LIMIT 0, 10' );
$stmt->bind_param( 'i', $last_id );
$stmt->execute();
$stmt->bind_result($id, $nome);
while($stmt->fetch()) {
?>
<div id="<?php print "$id" ?>" class="singleRecord"><?php print $nome; ?></div>
<?php
}
$con->close();
?>
ho pensato che la soluzione sia nel fermare la funzione scroll fino al momento in cui non vengano restituiti i 10 record..codice:<div id="entries"> <div class="ajaxloader">[img]../img/ajax-loader.gif[/img]</div> </div>
ma come fare?
Grazie per l'aiuto!
![]()

Rispondi quotando