CODEWITHSUNDEEP
phpjquerycodeigniter
BigJobbies
BigJobbies

Reputation: 4033

CodeIgniter / jQuery - Pagination - Endless Pagination

Im trying to implement the endless pagination jquery plugin found here ( https://github.com/jney/jquery.pageless ) into my codeigniter project.

The jquery code i enter is the same as whats on the demo page

$('#results').pageless({ totalPages: 10
, url: '/theurl/index'
, loaderMsg: 'Loading more results'
});

and the code i have in my codeigniter controller is as follows

    $config['base_url'] = base_url() . 'theurl/index';
    $config['total_rows'] = $this->model->record_count();
    $config['per_page'] = 20;
    $config['uri_segment'] = 3;

    // Init the config
    $this->pagination->initialize( $config );

    // Create pagination
    $page = ($this->uri->segment(3)) ? $this->uri->segment(3) : 0;
    $data['results'] = $this->onyafeet->fetch_results($config['per_page'], $page);
    $data['links'] = $this->pagination->create_links();

    // Load the view and pass through all the data
    $this->load->view('theurl/index', $data);

When i run the code, and reach the bottom of the page, it does work, but it also loads the enter page into the new div it creates just for the results.

Any help would be greatly appreciated.

Cheers

Upvotes: 4

Views: 775

Answers (1)

Federico J.
Federico J.

Reputation: 15882

maybe you should load the results into a partial view, because otherwise you're loading again the whole page. Create a partial view to load all the data, and then, load the partial view into the main page: 

$config['base_url'] = base_url() . 'theurl/index';
$config['total_rows'] = $this->model->record_count();
$config['per_page'] = 20;
$config['uri_segment'] = 3;

// Init the config
$this->pagination->initialize( $config );

// Create pagination
$page = ($this->uri->segment(3)) ? $this->uri->segment(3) : 0;
$data['results'] = $this->onyafeet->fetch_results($config['per_page'], $page);
$data['links'] = $this->pagination->create_links();
// AJAX load: 
if ($this->input->is_ajax_request) {
    $this->load->view('theurl/partial/ajax_partial',$data);
}
else {
    // Load the view and pass through all the data
    $this->load->view('theurl/index', $data);
}

I think that with this approach should work, the partial view must only have the right part that you want to show, the div with all the content you want to load asynchronously.

Upvotes: 2

Related Questions