获取所有数据后使加载更多按钮消失

Question

我的代码工作正常，单击加载更多按钮时它会显示更多用户。我现在的限制是如果响应没有更多价值，如何删除加载更多按钮。这就是我的模型的样子 public function getFreeAds($page){        $offset = 10*$page;        $limit = 10;        $this->db->select('*');        $this->db->from('escort');        $this->db->where('status', 'Approved');        $this->db->limit($offset ,$limit);        $this->db->order_by("time_stamp, UPPER(time_stamp)", "DESC");        $query = $this->db->get();        return $query->result();    }我的控制器看起来像这样 public function getCountry(){        $page =  $_GET['page'];        $countries = $this->Home_model->getCountry($page);        foreach($countries as $country){            echo                  '<div class="col-md-4 col-sm-6">                    <div class="portfolio-item">                     <div class="thumb">                    <a ><div class="hover-effect" data-e_id="'.$country->e_id.'" id="profile2">                    <div class="hover-content">                    <h1> '.$country->ProfileName.'</em></h1>                     <p> '.$country->Height.' CM tall '.$country->BreastCup.'  Breast Size <b>Nationality: '.$country->Nationality.' </b></p>                     <button  type="button"  class="btn-info">View More</button>                     <button  type="button"  class="'.$country->confirmstatus.'">'.$country->confirmstatus.'</button>                     <div class="top">                     </div>                     </div>                     </div></a>                     <div class="image" width="70%" height="1000px">                     <img src="uploads/'.$country->ProfilePicture.'">                     </div>                     </div>                     </div>                    </div>';        }        exit;    }这是我显示响应的查询代码。$(document).ready(function(){        getcountry(0);        $("#load_more").click(function(e){            e.preventDefault();            var page = $(this).data('val');            getcountry(page);        });    });

Answer 1

你可以做的是在同一个函数中获取下一个值，如果有可用的值，你可以创建一个输入字段（隐藏），然后根据它的值显示或隐藏按钮。

我正在为您的案例编写一个可能的解决方案，必要时会提到评论。请记住，有更好的方法可以做到这一点，例如使用计数，但这是根据您的代码。看看它是否对你有帮助。

控制器

public function getCountry(){

        $page       =  $_GET['page'];

        $countries  = $this->Home_model->getCountry($page);

        $nextValue  = $this->Home_model->getCountry($page+1); // get the values for the next page

        $showButton = !empty($nextValue) ? 'yes' : 'no'; // show the button if next value exists

        foreach($countries as $country){

            echo 

                 '<div class="col-md-4 col-sm-6">

                    <div class="portfolio-item">

                     <div class="thumb">

                    <a ><div class="hover-effect" data-e_id="'.$country->e_id.'" id="profile2">

                    <div class="hover-content">

                    <h1> '.$country->ProfileName.'</em></h1>

                     <p> '.$country->Height.' CM tall '.$country->BreastCup.'  Breast Size <b>Nationality: '.$country->Nationality.' </b></p>

                     <input type="hidden" class="showButton" value="'.$showButton.'" /> 

                     <!-- make a hidden input field and assign a value (yes/no) -->

                     <button  type="button"  class="btn-info">View More</button>

                     <button  type="button"  class="'.$country->confirmstatus.'">'.$country->confirmstatus.'</button>

                     <div class="top">

                     </div>

                     </div>

                     </div></a>

                     <div class="image" width="70%" height="1000px">

                     <img src="uploads/'.$country->ProfilePicture.'">

                     </div>

                     </div>

                     </div>

                    </div>';

        }

        exit;

    }

看法

var getcountry = function(page){

    $("#loader").show();

    $.ajax({

        url:"<?php echo base_url() ?>Home/getCountry",

        type:'GET',

        data: {page:page}

    }).done(function(response){

        $("#show_data").append(response);

        $("#loader").hide();

        $('#load_more').data('val', ($('#load_more').data('val')+1));

        // check the value of input field

        if($('.showButton:last').val() == "no"){

            $('#load_more').hide(); // hide the button

        }

        scroll();

    });

};

Answer 2

使用总页数添加到您的响应元数据。在每个请求期间，使用相同的子句对您的数据库进行计数查询。在每次请求后的 JS 代码中，将当前页面与响应中的总页数进行比较，如果到达最后一页，则隐藏按钮。