How to Create Ajax Pagination using CodeIgniter?
December 13, 2011 Leave a comment
CodeIgniter has many built-in classes and plugins. Pagination class of CodeIgniter is very easy and simple to use. Also Ajax Pagination library is availanle in Codeigniter. Here i will describe how to create simple ajax pagination in Codeigniter using some simple steps.
First of all download Ajax Pagination from Codeigniter site. And put this library in “system/libraries/” folder.
Along with library you need to download prototype.js file and put this file any where on root.
Here we have a table which we use for getting records and apply pagination on its records.
CREATE TABLE `my_best_friends` ( `f_id` int(11) NOT NULL auto_increment, `f_name` varchar(100) NOT NULL, `f_phone` int(11) NOT NULL, `f_email` int(11) NOT NULL, `f_address` int(11) NOT NULL, PRIMARY KEY (`f_id`) )
Your controller:
class Paging extends Controller { function Paging(){ parent::Controller(); $this->load->helper(array('form','url')); $this->load->helper('text'); $this->load->library('Ajax_pagination'); } function index() { redirect ('paging/my_friends'); } function my_friends() { $pdata['TotalRec'] = $this->FriendsModel->TotalRec(); $pdata['perPage'] = $this->perPage(); $pdata['ajax_function'] = 'get_friends_ajax'; $subdata['paging'] = $this->parser->parse('paging', $pdata, TRUE); $subdata['all_friends'] = $this->FriendsModel->my_friends($this->perPage()); $data['body_content'] = $this->parser->parse('friend_list', $subdata, TRUE); $this->load->view('main',$data); } function get_friends_ajax() { $pdata['TotalRec'] = $this->FriendsModel->TotalRec(); $pdata['perPage'] = $this->perPage(); $pdata['ajax_function'] = 'get_friends_ajax'; $data['paging'] = $this->parser->parse('paging', $pdata, TRUE); $data['all_friends'] = $this->FriendsModel->my_friends($this->perPage()); $this->load->view('friend_list',$data); } function PerPage() { return 5; } }
Model :
class FriendsModel extends Model { function FriendsModel() { parent::Model(); } function TotalRec() { $sql = "SELECT * FROM my_friends"; $q = $this->db->query($sql); return $q->num_rows(); } function my_friends($perPage) { $offset = $this->getOffset() $query ="SELECT * FROM my_friends Order By f_id Desc LIMIT ".$offset.", ".$perPage; $q = $this->db->query($query); return $q->result(); } function getOffset() { $page = $this->input->post('page'); if(!$page): $offset = 0; else: $offset = $page; endif; return $offset; } }
View: paging.php in application/views/ folder
$config['first_link'] = 'First'; $config['div'] = 'container'; //Div tag id $config['base_url'] = base_url().'paging/'.$ajax_function; $config['total_rows'] = $TotalRec; $config['per_page'] = $PerPage; $config['postVar'] = 'page'; $this->ajax_pagination->initialize($config); echo $this->ajax_pagination->create_links();
View: friend_list.php in application/views/ folder
<table border="1" width="200"> <tbody> <tr> <td>Friend Name</td> <td>Friend Phone</td> <td>Friend Address</td> </tr> foreach($all_friends as $row) { <tr> <td>echo $row->f_name</td> <td>echo $row->f_phone</td> <td>echo $row->f_address</td> </tr> }</tbody> </table>
Main home file: main.php in application/views/ folder
This file contains your html code and all css and js files.
I have just given main container where your data will show. you have to add html and css/js files your self.
<div id="container"> echo @$body_content;</div>