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

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(){&nbsp; &nbsp; &nbsp; &nbsp; $page&nbsp; &nbsp; &nbsp; &nbsp;=&nbsp; $_GET['page'];&nbsp; &nbsp; &nbsp; &nbsp; $countries&nbsp; = $this->Home_model->getCountry($page);&nbsp; &nbsp; &nbsp; &nbsp; $nextValue&nbsp; = $this->Home_model->getCountry($page+1); // get the values for the next page&nbsp; &nbsp; &nbsp; &nbsp; $showButton = !empty($nextValue) ? 'yes' : 'no'; // show the button if next value exists&nbsp; &nbsp; &nbsp; &nbsp; foreach($countries as $country){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; echo&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;'<div class="col-md-4 col-sm-6">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="portfolio-item">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<div class="thumb">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a ><div class="hover-effect" data-e_id="'.$country->e_id.'" id="profile2">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="hover-content">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <h1> '.$country->ProfileName.'</em></h1>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<p> '.$country->Height.' CM tall '.$country->BreastCup.'&nbsp; Breast Size <b>Nationality: '.$country->Nationality.' </b></p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<input type="hidden" class="showButton" value="'.$showButton.'" />&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<!-- make a hidden input field and assign a value (yes/no) -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<button&nbsp; type="button"&nbsp; class="btn-info">View More</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<button&nbsp; type="button"&nbsp; class="'.$country->confirmstatus.'">'.$country->confirmstatus.'</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<div class="top">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div></a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<div class="image" width="70%" height="1000px">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<img src="uploads/'.$country->ProfilePicture.'">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>';&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; exit;&nbsp; &nbsp; }看法var getcountry = function(page){&nbsp; &nbsp; $("#loader").show();&nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; url:"<?php echo base_url() ?>Home/getCountry",&nbsp; &nbsp; &nbsp; &nbsp; type:'GET',&nbsp; &nbsp; &nbsp; &nbsp; data: {page:page}&nbsp; &nbsp; }).done(function(response){&nbsp; &nbsp; &nbsp; &nbsp; $("#show_data").append(response);&nbsp; &nbsp; &nbsp; &nbsp; $("#loader").hide();&nbsp; &nbsp; &nbsp; &nbsp; $('#load_more').data('val', ($('#load_more').data('val')+1));&nbsp; &nbsp; &nbsp; &nbsp; // check the value of input field&nbsp; &nbsp; &nbsp; &nbsp; if($('.showButton:last').val() == "no"){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('#load_more').hide(); // hide the button&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; scroll();&nbsp; &nbsp; });};

Answer 2

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