How do I do the infinite scroll do not load the same values again?

0

I have the following code:

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"type="text/javascript"></script>  
    <script>


      $(document).ready(function() {
        $("#content").scroll(function() { 
          if ($(this).scrollTop() + $(this).height() == $(this).get(0).scrollHeight) {

        var lastID =  $('.carga-mais').attr ('lastID');


            $.ajax({
                type: "POST" ,

                data:{
                  referenciageral: lastID
                },
                 url: "getData.php" ,

                 beforeSend : function() {
                     $('.carga-mais').show();
                },
                success : function (html) {
                     $('.load-more').remove();
                    $('#content').append(html);
                }
            });
          }
        });
      });
    </script>

And a table that shows some data:

<table >
  <br>
  <br>
    <thead class ="headerr">

    </thead>
    <?php

$serverName = "servidor"; 
$connectioninfo = array( "Database"=>"banco", "UID"=>"usuario", "PWD"=>"senha");
  $conn = sqlsrv_connect($serverName, $connectioninfo);




  $query = "select  * FROM lista2 order by cast(referenciageral as int) offset 0 rows fetch next 40 rows only ";






  $output=sqlsrv_query($conn,$query) or die(print_r(sqlsrv_errors()));


     ?>

 <tbody class="oi">

  <?php

    while($fetch = sqlsrv_fetch_array($output)) 
  {

      $postID  =  $fetch["referenciageral"]; 

?>

      <?php echo  '
    <tr id="linha" style="background-color:'.$fetch['cordefundo'].'; color:'.$fetch['cordetexto'].'; ">';?> 


  <div id="list-item" class = "list-item"> <h4> <?php  echo  $fetch['referenciageral']; ?> </h4> </div>

<?php echo '
       </tr>'; ?> 




<?php
  }

    ?>
    <div  class = "carga-mais"  lastID ="<?php  echo  $postID ;  ?> " style = "display: none;">
    </tbody>

</table>

And the file getData which is the url of my ajax request I have the code:

<?php 
 require  'dbConfig.php' ; 

  // echo $_POST["referenciageral"]; 


?>

<?php 
if (!empty($_POST["referenciageral"])) { 

// Incluir arquivo de configuração do banco de dados 
require  'dbConfig.php' ; 

// Obtém o último ID 
$lastID  =  $_POST["referenciageral"];//$_POST['referenciageral']; 

// Limite na exibição de dados 
$showLimit  =  40 ; 

// Obtém todas as linhas exceto já exibidas 
$queryAll  = "SELECT COUNT (*) as num_rows FROM lista2  WHERE referenciageral>".$lastID." " ; 
$rowAll  =  sqlsrv_query($conn,$queryAll); 
 while($fetch = sqlsrv_fetch_array($rowAll)) {
    $allNumRows = $fetch['num_rows'];

 }

// Obtém linhas por limite, exceto as já exibidas 
$query  =  "SELECT * FROM lista2 ORDER BY cast(referenciageral as int) offset ".$lastID." rows fetch next ".$showLimit." rows only" ; 
$output = sqlsrv_query($conn,$query);
if ( $allNumRows  > 0) { 
    while ($linha  =  sqlsrv_fetch_array($output)) {  
        $postID  =  $linha["referenciageral"];

         ?> 

<div  class = "list-item" > <h4> <?php  echo  $linha['referenciageral']; ?> </H4> </div>
 <?php  }  ?> 
<?php  if ( $allNumRows  >  $showLimit ) {  ?> 
    <div  class = "load-more"  lastID = " <?php  echo  $postID ;  ?> "  style = " display: nenhum; " >
        <img  src = "icones/Loading_icon.gif" />
    </div>
 <?php  } else {  ?> 
    <div  class = "carga-mais"  lastID = "<?php  echo  $postID ;  ?>" >

    </div>
 <?php  } 
}  
} 
?>

It carries 40 items, then do the ajax request and loads of 41-80 but then when I arrive at the end of the page it makes a ajax request again and again shows the numbers 41-80 again instead of showing the 81 to 120, since I put a limit of 40 in 40 lines.

    
asked by anonymous 23.11.2018 / 13:05

0 answers