Question

默认情况下，我在数据库中显示6项。如果用户向下滚动，则每次会有更多项目列出2项。这是预期的行为。

但是目前，当页面向下滚动时，最后一项（第6项）会一次又一次显示。我发现由于我的sql查询而将结果限制为默认6项中的最后一个id。但即使这样，如果只有1个项目与查询匹配，它也不应该加载任何项目，但是当我向下滚动时，这会无限加载。

所以我需要帮助显示默认6项中最后一个ID后的项目，其次，如果显示所有结果，则不得滚动。

以下是我的代码，请帮助。

脚本

$(function()
 {
var ID=$(".result_container:last").attr("id");
//alert(ID);
$(window).scroll(function(){

if  ($(window).scrollTop() == $(document).height() - $(window).height()){
 console.log($(document).height());

/*fetched the items from db**/

         $.ajax({
        dataType: "json",
        url: 'showAllTutor.php?action=get&last_msg_id='+ID,
        success: function(data){
        console.log(data.length);                               
        for (i = 0; i < data.length; i++) {
         $('#showalltutor').append("<td><div class='result_container' id='"+data[i].postId+"'>show item here</div>");
        }
  }});
 }
);

PHP

 <?php
 $last_msg_id=$_GET['last_msg_id'];
 $action=$_GET['action'];

 if($last_msg_id=="")
 {
 ?>
 <?php
  $Tutor = new searchItems();
  $showAllTutor = $Tutor->showAllTutor($name);
  $json=array();
  foreach($showAllTutor as $key=>$value)
  {
     array_push($json,array("name"=>$value["name"],"subject"=>$value["subject"],"rate"=>$value['rate'],"dateposted"=>$value['dateposted'],"location"=>$value['location'],"contact"=>$value['contact'],"morning"=>$value['morning'],"afternoon"=>$value['afternoon'],"evening"=>$value['evening'],"postId"=>$value['postId'],"subid"=>$value['subid']));
  }
  ?>

  <?php
    }
    else
    {

     $sql="SELECT * FROM userinfo,posts WHERE userinfo.UUID = posts.UUID AND posts.postUUID = '$last_msg_id' LIMIT 2";
        $stmt =connection::$pdo->prepare($sql);
        $stmt->execute();
        $json=array();

        while($row = $stmt->fetch())
        {

          array_push($json,array("name"=>$row['name'],"subject"=>$row['subname'],"subid"=>$row['subID'],"rate"=>$row['pricing'],"dateposted"=>$row['datePosted'],"location"=>$row['location'],"contact"=>$row['phone'],"morning"=>$row['morning'],"afternoon"=>$row['afternoon'],"evening"=>$row['evening'],"postId"=>$row['postUUID']));
        }

    }

     echo json_encode($json);
    ?>

//the showAllTutor function as below:

public function showAllTutor()
    {

        $sql="SELECT * FROM userinfo,posts WHERE userinfo.UUID = posts.UUID LIMIT 6";
        $stmt =connection::$pdo->prepare($sql);
        $stmt->execute();
        $tutorAll=array();

        while($row = $stmt->fetch())
        {
          array_push($tutorAll,array("name"=>$row['name'],"subject"=>$row['subname'],"subid"=>$row['subID'],"rate"=>$row['pricing'],"dateposted"=>$row['datePosted'],"location"=>$row['location'],"contact"=>$row['phone'],"morning"=>$row['morning'],"afternoon"=>$row['afternoon'],"evening"=>$row['evening'],"postId"=>$row['postUUID']));
        }
        return $tutorAll;
    }

Answer 1

如果您没有得到答案，请尝试以下

     $page_number=2;//You need to pass the page number while making ajax for first it will be 1.for second it will be 2 and so on

        $limit=2;//Number of records you need to fetch

        $offest=$limit*$page_number+$limit;

        $sql = "
            SELECT * 
            FROM userinfo,posts 
            WHERE userinfo.UUID = posts.UUID 
                LIMIT $offest,$limit";

        $stmt = connection::$pdo->prepare($sql);
        $stmt->execute();
$json=array('status'=>true,'data'=>array());
$count =$stmt->rowCount();
if($count>0){
 while($row = $stmt->fetch())
        {

          array_push($json['data'],array("name"=>$row['name'],"subject"=>$row['subname'],"subid"=>$row['subID'],"rate"=>$row['pricing'],"dateposted"=>$row['datePosted'],"location"=>$row['location'],"contact"=>$row['phone'],"morning"=>$row['morning'],"afternoon"=>$row['afternoon'],"evening"=>$row['evening'],"postId"=>$row['postUUID']));
        }
}else{
$json['status']=false;
}

一旦你通过在javascript中设置变量获得空响应，你将需要限制ajax调用。所以不再有ajax调用将被发送到服务器。在进行ajax检查之前，有一个条件如下

$(function()
 {
var is_more_result=true;//To check if there is any data by default keep true
var ID=$(".result_container:last").attr("id");
//alert(ID);
$(window).scroll(function(){

if  (($(window).scrollTop() == $(document).height() - $(window).height()) &&  is_more_result){
 console.log($(document).height());

/*fetched the items from db**/

         $.ajax({
        dataType: "json",
        url: 'showAllTutor.php?action=get&last_msg_id='+ID,
        success: function(data){
        if(!data['status']){
          is_more_result=false;
            }                              
        for (i = 0; i < data['data'].length; i++) {
         $('#showalltutor').append("<td><div class='result_container' id='"+data[i].postId+"'>show item here</div>");
        }
  }});
 }
);

自动加载滚动无限次地一次又一次显示最后一项

1 个答案: