Trending Topics

Pagination in Codeigniter with Step by Step

In this tutorial, you will learn how to use codeigniter pagination in order to display records in chunks. Displaying records in chunks helps in loading the page very fast. It reduces the load on the server also by lowering the number of records at-once. We will understand pagination concept by displaying blog posts.

Let’s start with Database Configuration.

  1. Create a database “sample_blog”.
  2. Create a table named “posts”.
CREATE TABLE `posts` (
  `id` int(11) NOT NULL,
  `author_id` int(11) NOT NULL,
  `title` varchar(255) NOT NULL,
  `description` varchar(500)  NOT NULL,
  `content` text NOT NULL,
  `date` date NOT NULL
) ;

Insert some records in posts table.

There are three files are required to create.

  1. Create a controller file “controllers/Blog.php”.
  2. Create a model file “models/Blog_mode.php”.
  3. Create a view file “views/blog_view.php”.
<?php

defined('BASEPATH') OR exit('No direct script access allowed');

class Blog extends CI_Controller {

    public function __construct() {
        parent::__construct();
        $this->load->database();
        $this->load->helper('url');
        $this->load->model('Blog_model');

        $this->limit = 10;
        $this->offset = 0;
    }

    public function index($pageno = NULL) {
        $data['title'] = 'Codeigniter Bootstrap4 Pagination';

        //Load the Pagination Library
        $this->load->library('pagination');

        $config['base_url'] = base_url('blog');
        $config['per_page'] = $this->limit;
        //calculate total number of records
        $config['total_rows'] = $this->Blog_model->get_total_rows_post(); 
        //Bootstrap 4 Codeigniter Style...
        $config['use_page_numbers'] = TRUE;
        $config['next_link'] = 'Next';
        $config['prev_link'] = 'Prev';
        $config['first_link'] = "≪ First";
        $config['last_link'] = "Last ≫";
        $config['full_tag_open'] = '<ul class="pagination justify-content-center">';
        $config['full_tag_close'] = '</ul>';
        $config['attributes'] = ['class' => 'page-link'];
        $config['first_tag_open'] = '<li class="page-item">';
        $config['first_tag_close'] = '</li>';
        $config['prev_tag_open'] = '<li class="page-item">';
        $config['prev_tag_close'] = '</li>';
        $config['next_tag_open'] = '<li class="page-item">';
        $config['next_tag_close'] = '</li>';
        $config['last_tag_open'] = '<li class="page-item">';
        $config['last_tag_close'] = '</li>';
        $config['cur_tag_open'] = '<li class="page-item active"><span class="page-link">';
        $config['cur_tag_close'] = '<span class="sr-only">(current)</span></span></li>';
        $config['num_tag_open'] = '<li class="page-item">';
        $config['num_tag_close'] = '</li>';

        $this->pagination->initialize($config);

        if (isset($pageno) && is_numeric($pageno)) {
            $param = array(
                'limit' => $this->limit,
                'offset' => ($pageno - 1) * $this->limit
            );
        } else {
            $param = array(
                'limit' => $this->limit,
                'offset' => $this->offset
            );
        }

        $data['blog'] = $this->Blog_model->get_posts($param);

        $this->load->view('blog_view', $data);
    }

}

<?php

defined('BASEPATH') OR exit('No Direct Scripts Allowed');

class Blog_model extends CI_Model {

    public function __construct() {
        parent::__construct();
        $this->load->database();
    }

    public function get_posts($param) {
        $this->db->select();
        $this->db->from('posts');
        if (!empty($param['limit'])) {
            $this->db->limit($param['limit'], $param['offset']);
        }
        $query = $this->db->get();
        return $query->result_array();
    }

    public function get_total_rows_post() {
        $this->db->select('id');
        $this->db->from('posts');
        $query = $this->db->get();
        return $query->num_rows();
    }

}

<!DOCTYPE html>
<html lang="en">
    <head>
        <title><?php echo $title; ?></title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="<?php echo base_url('assets/css/bootstrap.min.css'); ?>">
        <script src="<?php echo base_url('assets/js/bootstrap.min.js'); ?>"></script>
        <style>
            body{
                background-color: #ffc107;
            }
        </style>
    </head>
    <body>

        <div class="jumbotron text-center" style="margin-bottom:0">
            <h1><?php echo $title; ?></h1>
        </div>

        <div class="container" style="margin-top:30px">
            
                <div class="col-sm-12"  id="results">
                    <?php foreach($blog as $post) : ?>
                    <div class="card">
                        <div class="card-body">
                            <h5><?php echo $post['id']. '. '. $post['title']; ?></h5>
                                <span class="badge badge-info"><?php echo date('M d,Y', strtotime($post['date'])); ?></span>
                            <p class="card-text"><?php echo $post['content']. ''. $post['description']; ?></p>
                        </div>
                    </div>
                    <?php endforeach; ?>
                </div>
                <div class="clearfix"></div>
                <br><br>
                <div class="" style="font-weight: bold;">
                    <?php echo $this->pagination->create_links(); ?>
                </div>                
                <br><br>
        </div>
        
        <div class="jumbotron text-center" style="margin-bottom:0">Footer</div>

    </body>
</html>

Please modify database.php file in config folder.

Database name:sample_blog
Hostname:’localhost’
Username: ‘root’
Password:”

$db['default'] = array(
	'dsn'	=> '',
	'hostname' => 'localhost',
	'username' => 'root',
	'password' => '',
	'database' => 'sample_blog',
	'dbdriver' => 'mysqli',
	'dbprefix' => '',
	'pconnect' => FALSE,
	'db_debug' => (ENVIRONMENT !== 'production'),
	'cache_on' => FALSE,
	'cachedir' => '',
	'char_set' => 'utf8',
	'dbcollat' => 'utf8_general_ci',
	'swap_pre' => '',
	'encrypt' => FALSE,
	'compress' => FALSE,
	'stricton' => FALSE,
	'failover' => array(),
	'save_queries' => TRUE
);

Please add below line of code in routes.php file in config folder.

$route[‘blog/(:num)’] = ‘blog/index/$1’;

Download