I am trying to add infinite scrolling to codeigniter's pagination with the Infinite scroll jquery plugin . But with no success
Here is my controller:
$config['base_url'] = site_url('news/home/');
$config['total_rows'] = $this->home_model->count_new();
$config['per_page'] = 3;
$config['uri_segment'] = 3;
$config['limit'] = $config['per_page'];
$this->pagination->initialize($config);
$data['news'] = $this->home_model->list_data_new($config['per_page'], $this->uri->segment($config['uri_segment']));
$this->load->view('news_view',$data);
Here is my view :
<div id="content">
<?php foreach ($news as $data):?>
<?php echo $data['title']?>
Post by: <?php echo $data['username']?>
<?php endforeach;?>
</div>
<button id="next">load more</button>
And here is the javascript also in view:
$('#content').infinitescroll({
navSelector : "#next:last",
// selector for the paged navigation (it will be hidden)
nextSelector : "#next:last",
// selector for the NEXT link (to page 2)
itemSelector : "#content"
// selector for all items you'll retrieve
});
The pagination link will look like this http://localhost/latihan/news/home/3
then click next will be like this http://localhost/latihan/news/home/6
The problem is the next post doesn't showing up and load more button is not loading data.
Any answer?
Many thanks...
Your setup is wrong.
I advise you have a look at the source code of the page http://www.infinite-scroll.com itself, because they are using their own plugin. Scroll down on the page to see it working.
Other than that I have to say that their product is extremely badly documented and works in quite unintuitive ways. For example, it will read the URL for the next page from nextSelector
, but only when that element is a hyperlink <a ...>
and only the first time. It will then parse that URL for occurrences of the number "2", load, and replace the number with 3 and so on. So your intended design with page 2 being home/3 and page 3 being home/6 will not work with this plugin.
Do yourself a favor and use jScroll instead.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.