JQuery滚动从Codeigniter中的数据库加载无限

时间:2019-03-25 06:43:31

标签: php jquery codeigniter

大家好,..我对JQuery的体验不是那么丰富。现在我正在Codeigniter中做一些工作。我想使用滚动加载数据。我的显示数据限制为8。因此,如果我们向下滚动。我将加载下一个8数据。但现在。它只是加载数据无穷大。只是循环来自上一个的数据。

我以此设置我的js文件

var slider = $('.contents').bxSlider({
    pager:false,
    controls:false,
    onSlideBefore: function($slideElement, oldIndex, newIndex){
      slideChange(newIndex);
      category_id = $('.active .category_id').val();
      if (!$(".active").hasClass("loaded")) {
        $.ajax({
          type : "POST",
          url : "/ajax/get_products_list_base",
          dataType : "json",
          data : {'category_id': category_id},
          success : function(res) {
            if(res.result) {
              $('.active').addClass('loaded');
              $('.'+category_id).append(res.data);
              $.colorbox.remove();
              $('.product_ajax').colorbox({
                onLoad:function(){
                }
              });
              scroll_load(category_id);
            } else {
              request = false;
            }
          },
          error: function (XMLHttpRequest, textStatus, errorThrown) {
            console.log("XMLHttpRequest : " + XMLHttpRequest.status);
            console.log("textStatus     : " + textStatus);
            console.log("errorThrown    : " + errorThrown.message);
            console.log("読み込み失敗");
            $('.active').addClass('loaded');
          }
        });
      }
    }
  });


function scroll_load(category_id) {
  var thisOffset;

  thisOffset = $('.list_'+category_id).find('.product_item').last().offset().top;

  $('.contents_' + category_id).on('scroll', function(){
    if(thisOffset - $(this).offset().top < $(this).scrollTop() + this.clientHeight){
      //if (request) {
        product_number = $('.' + category_id + ' .product_item').length;
        $.ajax( {
          type : "POST",
          url : "/ajax/get_products_for_list",
          dataType : "json",
          data : {'category_id': category_id,
            'product_number': product_number
          },
          success : function(res) {
            if(res.result) {
              $('.list_'+category_id).append(res.data);
              $.colorbox.remove();
              $('.product_ajax').colorbox({
                onLoad:function(){
                }
              });
            }
          },
          error: function (XMLHttpRequest, textStatus, errorThrown) {
            console.log("XMLHttpRequest : " + XMLHttpRequest.status);
            console.log("textStatus     : " + textStatus);
            console.log("errorThrown    : " + errorThrown.message);
            console.log("読み込み失敗");
          }
        });
      //}
    }
  });
}

以及与此相关的控制器

  public function get_products_list_base() {
        $post = $this->input->post();
        $category_id = $post['category_id'];
        $limit = 8;
        $this->load->model('Products');
        $this->load->model('Categories');
        $data['category'] = $this->Categories->get_category_by_categoryid($category_id);
        $data['products'] = $this->Products->get_all_products_for_products_list_by_category_id($category_id, $limit);
        $data['branch_id'] = $this->session->userdata('branch_account')['branch_id'];
        if (!empty($data['products'])) {
            $res = $this->load->view('products/_list_parts.html', $data, true);
            $return['result'] = true;
            $return['data'] = $res;
        } else {
            $return['result'] = false;
        }
        $this->output
             ->set_content_type('application/json')
             ->set_output(json_encode($return));
    }

public function get_products_for_list() {
        $post = $this->input->post();
        $category_id = $post['category_id'];
        $limit = 8;
        $product_number = $post['product_number'];
        $this->load->model('Products');
        $data['products'] = $this->Products->get_all_products_for_products_list_by_category_id($category_id, $limit, $product_number);
        $data['branch_id'] = $this->session->userdata('branch_account')['branch_id'];
        if (!empty($data['products'])) {
            $res = $this->load->view('products/_list_block.html', $data, true);
            $return['result'] = true;
            $return['data'] = $res;
        } else {
            $return['result'] = false;
        }
        $this->output
             ->set_content_type('application/json')
             ->set_output(json_encode($return));
    }

我该如何纠正显示负载数据。

0 个答案:

没有答案