How to load content in jscroll dynamically?

Question

I have a controller in codeigniter which loads the posts like:

public function loadpost($pg, $count = 2) {
    $offset = ($pg - 1)*$count;

    $this->load->model('posts');
    $posts = $this->posts->fetch_post($offset,$count);
    foreach ($posts as $post_item) {
        $data['post_item'] = $post_item;
        $t = $post_item['timestamp'];
        $telap = $this->time_elapsed($t);
        $data['time'] = $telap;
        $this->load->view('posts', $data);
    }
}

The "view" post is such that it uses the forwarded data and displays them like

<script type="text/javascript" src="<?php echo base_url(); ?>scripts/infiscroll.js"></script>
<div id="jscroll-container" class="jscroll">
<div class="row">Lots of content lines</div>
<div>

The file infiscroll.js makes a simple call to the jscroll function like:

$(document).ready(function () {
$('.jscroll').jscroll();
});

So when i continue scrolling it loads the same content again and again(which is what I expected since I am not changing the values). However what I am trying to figure out is where I can call the loadpost() function with the updated values so that the scrolling causes to load new post values. I could not find any documentation on how the view file, which calls the jscroll, is to be designed. Hence I'm looking forward to this community for guidance on how the initiation can be done as I'm totally new to jscroll and have no clue on how it can be used.

score 2 · Answer 1 · answered Oct 29 '15 at 20:24

There is a parameter called the "nextSelector". I changed the infiscroll.js file as:

$('.jscroll').jscroll({
    nextSelector: 'a.next-selector:last'
});

and added an anchor tag at the end of the view file as:

<script type="text/javascript" src="<?php echo base_url(); ?>scripts/infiscroll.js"></script>
<div id="jscroll-container" class="jscroll">
<div class="row">Lots of content lines</div>
<a href="<?php $pg++; echo base_url('index.php/home/loadpost/'.$pg) ?>" class='next-selector'></a>
<div>

$pg is the updated variable required by the function in the controller. I should have read about this feature earlier, but the documentation has surprisingly mentioned this as an undertone. Hope this helps anyone in a similar situation as mine.

How to load content in jscroll dynamically?

1 Answers1