1.Creamos la tabla con los resultados a paginar
Vamos a crear una tabla
llamada mensajes
CREATE TABLE IF NOT EXISTS
`mensajes` (
`id` int(11) NOT NULL auto_increment,
`de` varchar(50) collate utf8_bin NOT NULL,
`mensaje` varchar(50) collate utf8_bin NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=6 DEFAULT CHARSET=utf8 COLLATE=utf8_bin;
`id` int(11) NOT NULL auto_increment,
`de` varchar(50) collate utf8_bin NOT NULL,
`mensaje` varchar(50) collate utf8_bin NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=6 DEFAULT CHARSET=utf8 COLLATE=utf8_bin;
Además, vamos a crear un
conjunto de mensajes ficticios:
INSERT INTO `mensajes` (`id`, `de`, `mensaje`) VALUES
(1, 'Mi jefe', 'Termina lo que tienes pendiente'),
(2, 'Mama', 'Hijo comunícate'),
(3, 'Profesor', 'Mañana es el examen'),
(4, 'Carlos', 'Págame'),
(5, 'Novia ', 'Ya no me atiendes como antes');
(6, 'Tio', 'Sobrino cuando vienes?'),
(7, 'Abuela', 'Querido nieto te he hecho un sueter'),
(8, 'Hermano', 'dónde tiraste mi tablet pc?');
(1, 'Mi jefe', 'Termina lo que tienes pendiente'),
(2, 'Mama', 'Hijo comunícate'),
(3, 'Profesor', 'Mañana es el examen'),
(4, 'Carlos', 'Págame'),
(5, 'Novia ', 'Ya no me atiendes como antes');
(6, 'Tio', 'Sobrino cuando vienes?'),
(7, 'Abuela', 'Querido nieto te he hecho un sueter'),
(8, 'Hermano', 'dónde tiraste mi tablet pc?');
2.Creamos Modelo para el paginador
Para este ejemplo
usamos como nombre de pagina localhost. En tu caso solo debes de reemplazarlo
por el nombre de tu página.
Una vez que hemos
configurado nuestra conexión a la base de datos (en database.php). Podemos
pasar a crear nuestro Modelo. Lo llamaremos modelo_paginador.php
En
Application\models\modelo_paginador.php
<?php
class Modelo_paginador extends CI_Model {
function __construct()
{
parent::__construct();
}
public function count_mensajes()
{
return $this->db->count_all_results('mensajes');
}
public function list_mensajes($limit, $offset)
{
$this->db->limit($limit, $offset);
$query = $this->db->get('mensajes');
return $query->result();
}
}
class Modelo_paginador extends CI_Model {
function __construct()
{
parent::__construct();
}
public function count_mensajes()
{
return $this->db->count_all_results('mensajes');
}
public function list_mensajes($limit, $offset)
{
$this->db->limit($limit, $offset);
$query = $this->db->get('mensajes');
return $query->result();
}
}
3.Controlador
A continuación creamos
nuestro controlador, asumiendo que usamos como nombre "Welcome"
Application\controllers\welcome.php
.
<?php if ( !
defined('BASEPATH')) exit('No direct script access allowed');
class Welcome extends CI_Controller {
function __construct()
{
parent::__construct();
$this->db = $this->load->database('default', TRUE);
$this->load->library('pagination');
$this->load->model('Modelo_Paginador', 'modelo');
$this->load->helper(array('url'));
}
public function index($offset='')
{
$this->load->view('vista_mensajes'); // solo cargaremos la vista
}
public function lista($offset='')
{
$limit = 2;
$total = $this->modelo->count_mensajes();
$data['mensajes'] = $this->modelo->list_mensajes($limit, $offset);
$config['base_url'] = base_url().'welcome/lista/';
$config['total_rows'] = $total;
$config['per_page'] = $limit;
$config['uri_segment'] = '3';
$this->pagination->initialize($config);
$data['pag_links'] = $this->pagination->create_links();
$data['title'] = 'Pagination';
$this->load->view('lista_vista', $data);
}
}
class Welcome extends CI_Controller {
function __construct()
{
parent::__construct();
$this->db = $this->load->database('default', TRUE);
$this->load->library('pagination');
$this->load->model('Modelo_Paginador', 'modelo');
$this->load->helper(array('url'));
}
public function index($offset='')
{
$this->load->view('vista_mensajes'); // solo cargaremos la vista
}
public function lista($offset='')
{
$limit = 2;
$total = $this->modelo->count_mensajes();
$data['mensajes'] = $this->modelo->list_mensajes($limit, $offset);
$config['base_url'] = base_url().'welcome/lista/';
$config['total_rows'] = $total;
$config['per_page'] = $limit;
$config['uri_segment'] = '3';
$this->pagination->initialize($config);
$data['pag_links'] = $this->pagination->create_links();
$data['title'] = 'Pagination';
$this->load->view('lista_vista', $data);
}
}
4.Vistas para el ejemplo de paginación
IMAGEN Vemos que en la
función index cargamos una vista llamada 'vista_mensajes'. Por otra parte, en
la función 'lista' tenemos la carga a la vista 'lista_vista'.
Para continuar vamos a
crear estas vistas y también explicarlas un poco, ya que el asunto se sale de
lo tratado en el manual de Codeigniter:
Comencemos con
Application\views\ vista_mensajes.php
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="Heislersin" />
<script src="http://code.jquery.com/jquery-1.7.js"></script> <script type="text/javascript">
$(document).ready(function(){
$("#contenedor").load("/welcome/lista");
$(document).on("click", "#pagination-digg li a", function(e){
e.preventDefault();
var href = $(this).attr("href");
$("#contenedor").load(href);
});
});
</script>
<style type="text/css">
<!--
/* == Pagination === */
ul{border:0; margin:0; padding:0;}
#pagination-digg li{
border:0; margin:0; padding:0;
IMAGEN font-size:11px;
list-style:none;
margin-right:2px;
}
#pagination-digg a{
border:solid 1px #c6baa4;
margin-right:2px;
}
#pagination-digg .previous-off, #pagination-digg .next-off {
border:solid 1px #c6baa4;
color:#222222;
display:block;
float:left;
font-weight:bold;
margin-right:2px;
padding:3px 4px;
}
#pagination-digg .next a, #pagination-digg .previous a {
font-weight:bold;
}
#pagination-digg .active{
background:#c6baa4;
color:#FFFFFF;
font-weight:bold;
display:block;
float:left;
padding:4px 6px;
}
#pagination-digg a:link, #pagination-digg a:visited {
color:#222222;
display:block;
float:left;
padding:3px 6px;
text-decoration:none;
}
#pagination-digg a:hover{
border:solid 1px #222222
}
-->
</style>
</head>
<body>
<div id="contenedor">
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="Heislersin" />
<script src="http://code.jquery.com/jquery-1.7.js"></script> <script type="text/javascript">
$(document).ready(function(){
$("#contenedor").load("/welcome/lista");
$(document).on("click", "#pagination-digg li a", function(e){
e.preventDefault();
var href = $(this).attr("href");
$("#contenedor").load(href);
});
});
</script>
<style type="text/css">
<!--
/* == Pagination === */
ul{border:0; margin:0; padding:0;}
#pagination-digg li{
border:0; margin:0; padding:0;
IMAGEN font-size:11px;
list-style:none;
margin-right:2px;
}
#pagination-digg a{
border:solid 1px #c6baa4;
margin-right:2px;
}
#pagination-digg .previous-off, #pagination-digg .next-off {
border:solid 1px #c6baa4;
color:#222222;
display:block;
float:left;
font-weight:bold;
margin-right:2px;
padding:3px 4px;
}
#pagination-digg .next a, #pagination-digg .previous a {
font-weight:bold;
}
#pagination-digg .active{
background:#c6baa4;
color:#FFFFFF;
font-weight:bold;
display:block;
float:left;
padding:4px 6px;
}
#pagination-digg a:link, #pagination-digg a:visited {
color:#222222;
display:block;
float:left;
padding:3px 6px;
text-decoration:none;
}
#pagination-digg a:hover{
border:solid 1px #222222
}
-->
</style>
</head>
<body>
<div id="contenedor">
</div>
</body>
</html>
Creacion Otra vista
Application\views\lista_vista.php
<ul class="nav"
id="nav1">
<?php
foreach($mensajes as $p){
?>
<li><?php echo $p->de;?>: <?php echo $p->mensaje;?></li><?php
}
?>
</ul>
<ul id="pagination-digg">
<?php echo $pag_links;?>
</ul>
<?php
foreach($mensajes as $p){
?>
<li><?php echo $p->de;?>: <?php echo $p->mensaje;?></li><?php
}
?>
</ul>
<ul id="pagination-digg">
<?php echo $pag_links;?>
</ul>
