Paginación con PHP y MySQL. Ejemplo 2

14 de agosto de 2003
Valoración del artículo:
Mostramos un script para realizar la paginación de resultados con PHP y MySQL. Ofrecemos el script para descarga con instrucciones para ponerlo en marcha.
Atención: Contenido exclusivo de DesarrolloWeb.com. No reproducir. Copyright.
La paginación de resultados con PHP es uno de los talleres más interesantes y prácticos que se pueden hacer con esta tecnología. Casi todos los sitios web que implementan algún tipo de búsqueda deben en algún momento utilizar la paginación de resultados para no arrojar una cantidad desmesurada de datos en una única página. Como se ha visto desde siempre en los buscadores tipo Google, es mucho mejor presentar los resultados en varias páginas distintas y colocar en la parte de abajo una lista de las páginas de resultados que la búsqueda ha encontrado.

Para realizar este ejercicio se ha utilizado una base de datos MySQL y programación utilizando la tecnología PHP.

Podemos ver el resultado que vamos a conseguir con este artículo ahora y así tendremos más facilidad de identificar las distintas partes del código que vamos a comentar.

Nota: La paginación de resultados ya se ha visto en un artículo anterior de PHP. En este caso ofrecemos otro ejemplo realizado por otro programador que seguro que nos sirve para hacernos una idea más global sobre como afrontar este tipo de problemas.

El código de este ejercicio, junto con algunas instrucciones para ponerlo en marcha, se puede descargar en este enlace.

Poner en marcha el ejemplo

En el propio código de la paginación se encuentran las instrucciones para ponerlo en marcha y explicaciones sobre el funcionamiento del script. En este texto se preproducen algunas de las notas ofrecidas para ponerlo en marcha.

1.- Copiar el fichero busqueda.php en cualquier directorio del servidor web
2.- Crear una base de datos llamado 'tpv' (si es diferente, deberíais cambiar el código)
3.- Cambiar los datos de conexión si son diferentes.
4.- Cargar la siguiente tabla en la base de datos:

CREATE TABLE comercios (
    co_id varchar(10) NOT NULL default '',
    co_nombre varchar(30) NOT NULL default '',
    co_pais varchar(30) NOT NULL default '',
    UNIQUE KEY co_id (co_id)
    ) TYPE=MyISAM;

5.- Realizar los siguientes insert


INSERT INTO comercios VALUES ('ESGR000002', 'PRUEBA 2', 'ESPAÑA');
INSERT INTO comercios VALUES ('ESGR000001', 'PRUEBA 1', 'ESPAÑA');
INSERT INTO comercios VALUES ('516', 'JUAN PEREZ', 'MEXICO');
INSERT INTO comercios VALUES ('984', 'ANTONIO RODRIGUEZ', 'MEXICO');
INSERT INTO comercios VALUES ('996', 'INDALECIO TRAVIANNI', 'ARGENTINA');
INSERT INTO comercios VALUES ('975', 'ABELARDO SAINZ', 'PERU');
INSERT INTO comercios VALUES ('111', 'JOSE TOLTACA', 'PERU');
INSERT INTO comercios VALUES ('332', 'RAIMUNDO ALONSO', 'ARGENTINA');
INSERT INTO comercios VALUES ('123', 'JUN JUANES', 'BRASIL');
INSERT INTO comercios VALUES ('585', 'JOAO PAMINHIO', 'BRASIL');
INSERT INTO comercios VALUES ('23432432', 'JOAQUIN DIAZ', 'ESPAÑA');

Por supuesto estos datos pueden ser los que queráis, solo sirve de ejemplo.

Una vez realizados todos estos pasos, ejecutar el fichero busqueda php... y a probar... :D

Nota: Al ser este un pequeño ejemplo, en el formulario de busqueda he dejado que busque el valor introducido en todos los campos.

El código del script se puede ver a continuación:

<?
    mysql_connect("localhost","root","");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ejemplo de paginación de resultados</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Pragma" content="no-cache" />
<style type="text/css">
<!--
a.p:link {
    color: #0066FF;
    text-decoration: none;
}
a.p:visited {
    color: #0066FF;
    text-decoration: none;
}
a.p:active {
    color: #0066FF;
    text-decoration: none;
}
a.p:hover {
    color: #0066FF;
    text-decoration: underline;
}
a.ord:link {
    color: #000000;
    text-decoration: none;
}
a.ord:visited {
    color: #000000;
    text-decoration: none;
}
a.ord:active {
    color: #000000;
    text-decoration: none;
}
a.ord:hover {
    color: #000000;
    text-decoration: underline;
}
-->
</style>
</head>
<body bgcolor="#FFFFFF">
<script language="JavaScript">
function muestra(queCosa)
{
    alert(queCosa);
}
</script>
<div align="center"><strong><font color="#000000" size="2" face="Verdana, Arial, Helvetica, sans-serif">Paginación
de Resultados de una consulta SQL (sobre MySQL)<br><br><p><a href="http://www.pclandia.com">www.pclandia.com</a></p> </font></strong> </div>
<hr noshade style="color:CC6666;height:1px">
<br>
<?
//inicializo el criterio y recibo cualquier cadena que se desee buscar
$criterio = "";
$txt_criterio = "";
if ($_GET["criterio"]!=""){
   $txt_criterio = $_GET["criterio"];
   $criterio = " where co_id like '%" . $txt_criterio . "%' or co_nombre like '%" . $txt_criterio . "%' or co_pais like '%" . $txt_criterio . "%'";
}


$sql="SELECT * FROM tpv.comercios ".$criterio;
$res=mysql_query($sql);
$numeroRegistros=mysql_num_rows($res);
if($numeroRegistros<=0)
{
    echo "<div align='center'>";
    echo "<font face='verdana' size='-2'>No se encontraron resultados</font>";
    echo "</div>";
}else{
    //////////elementos para el orden
    if(!isset($orden))
    {
       $orden="co_id";
    }
    //////////fin elementos de orden

    //////////calculo de elementos necesarios para paginacion
    //tamaño de la pagina
    $tamPag=5;

    //pagina actual si no esta definida y limites
    if(!isset($_GET["pagina"]))
    {
       $pagina=1;
       $inicio=1;
       $final=$tamPag;
    }else{
       $pagina = $_GET["pagina"];
    }
    //calculo del limite inferior
    $limitInf=($pagina-1)*$tamPag;

    //calculo del numero de paginas
    $numPags=ceil($numeroRegistros/$tamPag);
    if(!isset($pagina))
    {
       $pagina=1;
       $inicio=1;
       $final=$tamPag;
    }else{
       $seccionActual=intval(($pagina-1)/$tamPag);
       $inicio=($seccionActual*$tamPag)+1;

       if($pagina<$numPags)
       {
          $final=$inicio+$tamPag-1;
       }else{
          $final=$numPags;
       }

       if ($final>$numPags){
          $final=$numPags;
       }
    }

//////////fin de dicho calculo

//////////creacion de la consulta con limites
$sql="SELECT * FROM tpv.comercios ".$criterio." ORDER BY ".$orden.",co_id ASC LIMIT ".$limitInf.",".$tamPag;
$res=mysql_query($sql);

//////////fin consulta con limites
echo "<div align='center'>";
echo "<font face='verdana' size='-2'>encontrados ".$numeroRegistros." resultados<br>";
echo "ordenados por <b>".$orden."</b>";
if(isset($txt_criterio)){
    echo "<br>Valor filtro: <b>".$txt_criterio."</b>";
}
echo "</font></div>";
echo "<table align='center' width='80%' border='0' cellspacing='1' cellpadding='0'>";
echo "<tr><td colspan='3'><hr noshade></td></tr>";
echo "<th bgcolor='#CCCCCC'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina = ".$pagina."&orden=co_id&criterio=".$txt_criterio."'>Código</a></th>";
echo "<th bgcolor='#CCCCCC'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina = ".$pagina."&orden=co_nombre&criterio=".$txt_criterio."'>Nombre</a></th>";
echo "<th bgcolor='#CCCCCC'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina = ".$pagina."&orden=co_pais&criterio=".$txt_criterio."'>País</a></th>";
while($registro=mysql_fetch_array($res))
{
?>
   <!-- tabla de resultados -->
    <tr bgcolor="#CC6666" onMouseOver="this.style.backgroundColor='#FF9900';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#CC6666'"o"];" onClick="javascript:muestra('<? echo "[".$registro["co_id"]."] ".$registro["co_nombre"]." - ".$registro["co_pais"]; ?>');">
    <td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_id"]; ?></b></font></td>
    <td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_nombre"]; ?></b></font></td>
    <td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_pais"]; ?></b></font></td>
    </tr>
   <!-- fin tabla resultados -->
<?
}//fin while
echo "</table>";
}//fin if
//////////a partir de aqui viene la paginacion
?>
    <br>
    <table border="0" cellspacing="0" cellpadding="0" align="center">
    <tr><td align="center" valign="top">
<?
    if($pagina>1)
    {
       echo "<a class='p' href='".$_SERVER["PHP_SELF"]."?pagina=".($pagina-1)."&orden=".$orden."&criterio=".$txt_criterio."'>";
       echo "<font face='verdana' size='-2'>anterior</font>";
       echo "</a> ";
    }

    for($i=$inicio;$i<=$final;$i++)
    {
       if($i==$pagina)
       {
          echo "<font face='verdana' size='-2'><b>".$i."</b> </font>";
       }else{
          echo "<a class='p' href='".$_SERVER["PHP_SELF"]."?pagina=".$i."&orden=".$orden."&criterio=".$txt_criterio."'>";
          echo "<font face='verdana' size='-2'>".$i."</font></a> ";
       }
    }
    if($pagina<$numPags)
   {
       echo " <a class='p' href='".$_SERVER["PHP_SELF"]."?pagina=".($pagina+1)."&orden=".$orden."&criterio=".$txt_criterio."'>";
       echo "<font face='verdana' size='-2'>siguiente</font></a>";
   }
//////////fin de la paginacion
?>
    </td></tr>
    </table>
<hr noshade style="color:CC6666;height:1px">
<div align="center"><font face="verdana" size="-2"><a class="p" href="index.php">::Inicio::</a></font></div>

<form action="busqueda.php" method="get">
Criterio de búsqueda:
<input type="text" name="criterio" size="22" maxlength="150">
<input type="submit" value="Buscar">
</form>

</body>
</html>
<?
    mysql_close();
?>


Se puede descargar aquí.

Comentarios
Fueron enviados 35 comentarios al artículo
24 comentarios no revisados
11 comentarios revisados:
Por: Miguel Anguita
21/5/04
Sería muy útil que se ampliara el artículo con la explicación de cómo hacer una búsqueda avanzada. El usuario escribe diversas palabras en varios campos y el programa busca en la BD los registros aque cumplen las condiciones, se podría usar AND, OR y > o bien < para los campos numéricos. Gracias.
Por: Martin
11/10/04
Este scrip esta excelente !!! No solo funciona perfectamente sino que es sencillo y además tiene un buscador muy bueno...
Por: j0s
11/2/06
si ta bueno el articulo ,, pero deberian corregir la parte del sql ...
donde co_id no debe ser de campo (varchar) si no de campo " int "(entero)
bueno.,porque tuve problemas al subir...menos mal me di cuenta :D jejje...saludos (y)

juan_ju...
no funciona
30/10/09
a mi no me funciona para nada

edith_v...
Excelente artículo
22/11/09
¡Muy buen artículo! Gracias!

innovar...
cogido
27/12/09
debes corregir esta linea
if(!isset($_GET["pagina"]))
{
$pagina=1;
$inicio=1;
$final=$tamPag;
}else{
$pagina = $_GET["pagina"];
}

sine
separar el formulario de los resultados
10/2/10
Me gustaría que los resultados no se muestren hasta que el usuario introduzca el "criterio" de búsqueda (tal como está configurado ahora, se muestran todos los registros de la tabla y se indica el total de registros sin haber buscado nada) ¿Alguien puede ayudarme en esto?

carla__...
No Funciona
20/2/10
No funciona el tutorial....lo probe copiandolo y descargandolo.....cueck!!!
payuda con la paginacion
09/3/10
para aquellos q le funciono correctamente me podrian pasar el codigo, todavia no la tengo tan clara con el php ,, pero lo probre le modifique el Get y funciona la primera paginacion pero cuando utilizo el buscador no pasa de la primera pagina aparecen las siguiente paginas pero cuando quiero ir a ellas directamente no pasa nada ,por favor a aquellos webmaster URGENTE AYUDA les paso el codigo ta basado en el ejemplo adaptado a mi tabla, me pueden corregir el error no lo encuentro y no se como hacerlo.
<?php

mysql_connect("localhost","root","");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Consultas Sobre Productos</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Pragma" content="no-cache" />
<style type="text/css">
<!--
a.p:link {
color: #0066FF;
text-decoration: none;
}
a.p:visited {
color: #0066FF;
text-decoration: none;
}
a.p:active {
color: #0066FF;
text-decoration: none;
}
a.p:hover {
color: #0066FF;
text-decoration: underline;
}
a.ord:link {
color: #000000;
text-decoration: none;
}
a.ord:visited {
color: #000000;
text-decoration: none;
}
a.ord:active {
color: #000000;
text-decoration: none;
}
a.ord:hover {
color: #000000;
text-decoration: underline;
}


-->
</style>
</head>
<body bgcolor="#FFFFFF">

<script language="JavaScript">
function muestra(queCosa)
{
alert(queCosa);
}
</script>
<div align="center" class=
"Estilo4">
<strong><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><br>

</font></strong><font color="#000000">
<p><strong><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.insitegroup.com.ar">www.insitegroup.com.ar</a></font></strong></p>
</font> </div>
<hr noshade style="color:6699ff;height:1px">
<br>
<?
//inicializo el criterio y recibo cualquier cadena que se desee buscar
$criterio = "";
$txt_criterio = "";
if ($_GET["criterio"]!=""){
$txt_criterio = $_GET["criterio"];
$criterio = " where co_id like '%" . $txt_criterio . "%' or co_nombre like '%" . $txt_criterio . "%' or co_descrip like '%" . $txt_criterio . "%'";
}


$sql="SELECT * FROM tpv.comercios ".$criterio;
$res=mysql_query($sql);
$numeroRegistros=mysql_num_rows($res);
if($numeroRegistros<=0)
{
echo "<div align='center'>";
echo "<font face='verdana' size='-2'>No se encontraron resultados</font>";
echo "</div>";
}else{
//////////elementos para el orden
if(!isset($orden))
{
$orden="co_nombre";
}
//////////fin elementos de orden

//////////calculo de elementos necesarios para paginacion
//tamaño de la pagina
$tamPag=10;

//pagina actual si no esta definida y limites
if(!isset($_GET["pagina"]))
{
$pagina=1;
$inicio=1;
$final=$tamPag;
}else{
$pagina = $_GET["pagina"];
}
//calculo del limite inferior
$limitInf=($pagina-1)*$tamPag;

//calculo del numero de paginas
$numPags=ceil($numeroRegistros/$tamPag);
if(!isset($pagina))
{
$pagina=1;
$inicio=1;
$final=$tamPag;
}else{
$seccionActual=intval(($pagina-1)/$tamPag);
$inicio=($seccionActual*$tamPag)+1;

if($pagina<$numPags)
{
$final=$inicio+$tamPag-1;
}else{
$final=$numPags;
}

if ($final>$numPags){
$final=$numPags;
}
}

//////////fin de dicho calculo

//////////creacion de la consulta con limites
$sql="SELECT * FROM tpv.comercios ".$criterio." ORDER BY ".$orden.",co_nombre ASC LIMIT ".$limitInf.",".$tamPag;
$res=mysql_query($sql);

//////////fin consulta con limites
echo "<div align='center'>";
echo "<font face='verdana' size='-2'>encontrados ".$numeroRegistros." resultados<br>";
echo "ordenados por <b>".$orden."</b>";
if(isset($txt_criterio)){
echo "<br>Valor filtro: <b>".$txt_criterio."</b>";
}
echo "</font></div>";
echo "<table align='center' width='100%' border='0' cellspacing='1' cellpadding='0'>";
echo "<tr><td colspan='3'><hr noshade></td></tr>";
echo "<th bgcolor='#99ccff'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina=".$pagina."&orden=co_id&criterio=".$txt_criterio."'>Código</a></th>";
echo "<th bgcolor='#99ccff'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina=".$pagina."&orden=co_nombre&criterio=".$txt_criterio."'>Producto</a></th>";
echo "<th bgcolor='#99ccff'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina=".$pagina."&orden=co_descript&criterio=".$txt_criterio."'>Descripcion</a></th>";
echo "<th bgcolor='#99ccff'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina=".$pagina."&orden=co_precios=".$txt_criterio."'>Precio</a></th>";
echo "<th bgcolor='#99ccff'><a class='ord' href='".$_SERVER["PHP_SELF"]."?pagina=".$pagina."&orden=Imagen&criterio=".$txt_criterio."'>Imagen</a></th>";
while($registro=mysql_fetch_array($res))
{
?>

<!-- tabla de resultados -->
<tr bgcolor="#6699ff" onMouseOver="this.style.backgroundColor='#33CC33';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#6666ff'"o"];" onClick="javascript:muestra('<? echo "[".$registro["co_id"]."] ".$registro["co_nombre"]." - ".$registro["co_descrip"]; ?>');">
<td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_id"]; ?></b></font></td>
<td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_nombre"]; ?></b></font></td>
<td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_descrip"]; ?></b></font></td>
<td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["co_precios"]; ?></b></font></td>
<td><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#FFFFCC"><b><? echo $registro["Imagen"]; ?></b></font></td>
</tr>
<!-- fin tabla resultados -->
<?
}//fin while
echo "</table>";
}//fin if
//////////a partir de aqui viene la paginacion
?>
<br>
<table border="0" cellspacing="1" cellpadding="0" align="center">
<tr><td align="center" valign="top" bgcolor="#FFFFFF">
<?
$pagina = $_GET["pagina"];
if($pagina>1)
{
echo "<a class='p' href='".$_SERVER["PHP_SELF"]."?pagina=".($pagina-1)."&orden=".$orden."&criterio=".$txt_criterio."'>";
echo "<font face='verdana' size='-2'>anterior</font>";
echo "</a>&nbsp;";
}

for($i=$inicio;$i<=$final;$i++)
{
if($i==$pagina)
{
echo "<font face='verdana' size='-2'><b>".$i."</b>&nbsp;</font>";
}else{
echo "<a class='p' href='".$_SERVER["PHP_SELF"]."?pagina=".$i."&orden=".$orden."&criterio=".$txt_criterio."'>";
echo "<font face='verdana' size='-2'>".$i."</font></a>&nbsp;";
}
}
if($pagina<$numPags)
{
echo "<a class='p' href='".$_SERVER["PHP_SELF"]."?pagina=".($pagina+1)."&orden=".$orden."&criterio=".$txt_criterio."'>";
echo "<font face='verdana' size='-2'>siguiente</font></a>";
}
//////////fin de la paginacion
?>
</td>
</tr>
</table>
<hr noshade style="color:#6699ff;height:1px">
<div align="center"><font face="verdana" size="-2"><a class="p" href="index.php">::Inicio::</a></font></div>

<form action="busqueda.php" method="get">
Criterio de búsqueda:
<input type="text" name="criterio" size="22" maxlength="150">
<input type="submit" value="Buscar">
</form>

</body>
</html>

abccorp
Muy Bueno
06/5/10
Esta exelente tu script gracias....y con modificaciones es mucho mas potente

enrique...
correccion
08/9/10
el script es EXCELENTE! un buen ejemplo para comenzar! Pero el error de la paginacion q no slata es que deben inicializar la variable pagina en valor no en 1, ya q al empezar con valor 1 menos 1 (o sea cero) y multiplicar por tampag, siempre su valor sera CERO y no avanzara, por q liminf es CERO, lo estoy probando.... pero en principio asi lo solucioné, Gracias a su Autor y estamso en contacto....
ASI es como me funciona
//pagina actual si no esta definida y limites
if(!isset($_POST["pagina"]))
{
===========================
en esta linea el error (el original dice que el valor es 1)
$pagina=2;
===========================
$inicio=1;
$final=$tamPag;
}else{
$pagina = $_POST["pagina"];
}

Manuales relacionados
Categorias relacionadas
El autor
Lectura recomendada
Compra este libro en Agapea, la librería urgente a domicilio.
Últimas noticias
Alojados en el grupo