listar.php

<?php

$url = "productos.php";

if (isset($_GET['pagina'])) {

    $pagina = $_GET['pagina'];

} else {

    $pagina = 1;

}

$tamano_pagina = 5;

$sql = "SELECT idarticulo from articulos";
$query = mysql_query($sql, $conn) or die(mysql_error());
$total_reg = mysql_num_rows($query);

$total_paginas = ceil($total_reg / $tamano_pagina);
$inicio = ($pagina - 1) * $tamano_pagina;


// TERMINA PAGINADOR

$sql2 = "
    SELECT
        idarticulo,
        articulo,
        codigo,
        articulos.idcategoria,
        categoria,
        articulos.estado,
        precio
    FROM articulos
    INNER JOIN categorias ON articulos.idcategoria=categorias.idcategoria
    LIMIT ".$inicio.", ".$tamano_pagina;

$qry = mysql_query($sql3, $conn) or die(mysql_error());

require_once 'listar_view.php'

?>

listar_view.php

<! -- TABLA DE RESULTADOS -->

<table class='mytable'>
    <thead>
        <tr>
            <th width='10%'>Acciones</th>
            <th width='15%'>Código</th>
            <th width='40%'>Producto</th>
            <th width='20%'>Categoría</th>
            <th width='15%'>Precio</th>
        </tr>
    </thead>
    <tbody align='left'>
    <?php while ($res = mysql_fetch_array($qry)): ?>
        <tr>
            <td></td>
            <td><?=$res['idarticulo']?></td>
            <td><?=$res['articulo']?></td>
            <td><?=$res['categoria']?></td>
            <td><?=$res['precio']?></td>
        </tr>
    <?php endwhile; ?>

    </tbody>
</table>";

<!-- NUMERO DE LA PAGINA ACTUAL -->

<?=$pagina?>

<!-- PAGINADOR -->
<div class='text-center' id='paginador'>

    <?php if ($pagina < $total_paginas) : ?>
        <a href="<?=$url."?pagina=".($pagina + 1)?>">Siguiente</a>
    <?php endif; ?>

    <?php if ($pagina > $total_paginas) : ?>
        echo "<a href="<?=$url."?pagina=".($pagina - 1)?>">Anterior</a>";
    <?php endif; ?>

</div>

productos.php

<h2>Listado</h2> 
<div class="col-md-4 col-xs-8" style=padding-left:30px;><form method="post"><input type="text" name="txbuscar" class="form-control" placeholder="buscar"></form></div> 
<div class="col-md-4 col-xs-2"><button class="btn btn-primary" data-toggle="modal" data-target="#form_nuevo">Nuevo</button></div> 
<div class="col-md-12" id="listado"> 
    
<div class="loading hide"><img src="../img/loading.gif" alt="cargando"></div> 
<div class="mensaje"></div> 
<!--TERMINA LISTADO--> 
</div> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
        <?php if (isset($pagina)): ?>
        $('#listado').load("inc/productos/listar.php?pagina=<?=$pagina?>"); 
        <?php else: ?>
        $('#listado').load("inc/productos/listar.php"); 
        <?php endif; ?>
        $('#idcategoria').load("inc/productos/lista_categorias.php"); 
    }); 
</script>