Portal » Programacion PHP » Paginacion sin usar Base de datos (crear paginacion en paginas estaticas)

Paginacion sin usar Base de datos (crear paginacion en paginas estaticas)

Desde uno de los foros que visito concurrentemente en este caso ForoBeta, salto una duda, de como realizar en php la paginacion de contenido cargado a mano, en pocas palabras, es un contenido que uno escribe sin necesidad de hacer consultas a la base de datos.

En nuestro caso usaremos Jquery para ser mas facil y rapido, solo debemos crear un html de esta forma:

<html>
<head>
    <title>Paginacion sin BD</title>
</head>
<body>
    
    <div id="page_1">
        Contenido del div 1
    </div>    
    <div id="page_2" style="display:none">
        Contenido del div 2
    </div>    
    <div id="page_3" style="display:none">
        Contenido del div 3
    </div>    
    <div id="page_4" style="display:none">
        Contenido del div 4
    </div>
    <p>
        <a href="javascript:void(0);" paginacion="1">1</a>&nbsp;<a href="javascript:void(0);" paginacion="2">2</a>
        &nbsp;<a href="javascript:void(0);" paginacion="3">3</a>&nbsp;<a href="javascript:void(0);" paginacion="4">4</a>
    </p>
    <!-- jquery -->
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() { 
            $('a').on("click",function(){
                var paginacion = $(this).attr('paginacion');
                var div = "#page_"   paginacion;
                $("div[id!=" div "]").hide();
                $(div).fadeIn("slow");
            });
        });
    </script>
</body>
</html>

Segun mi ejemplo debemos crear tantos divs como “paginacion” quieres tener.. por ejemplo si queres que tenga 4 paginas entonces debes crear 4 div’s con la caracteristica siguiente:

<div id="page_1">        
Contenido del div 1
</div>  

Una ves que tienes la cantidad de divs que quieres debes crear la misma cantidad pero links..

<a href="javascript:void(0);" paginacion="1">1</a>

Donde el atributo "paginacion" es el que ayudará a saber cual div mostraremos y cuales ocultaremos. 

Un ejemplo de como queda esta aqui Paginacion sin BD

Acerca de vicram10

Licenciado en Ciencias Informaticas con enfasis a Analisis de Sistemas Informaticos. Egresado de la Facultad Politecnica UNA. Apasionado de la tecnologia y del desarrollo de aplicaciones, desde el 2007 recorriendo por la internet.
  • Cristians Bregante Tintaya

    gracias! :v

    • webmercadonegro

      de nada para eso estamos, gracias por visitarnos

      • carol mesia

        :v

  • Erick Acevedo

    Hola, creo que tienes unos errores en el código; especialmente en el script, solamente es en la concadenación de las variables en javascript con el texto:

    $(document).ready(function() {

    console.log(“test”);

    $(‘a’).on(“click”,function(){

    var paginacion = $(this).attr(‘paginacion’);

    var div = “#page_” + paginacion;

    $(“div[id!=”+ div + “]”).hide();

    $(div).fadeIn(“slow”);

    });

    });

  • Hola, he estado probando el tutorial y debo decirte que tiene un pequeño
    fallo, y es que no admite ningun mas, ya que si lo pones no
    muestra nada.

    Un ejemplo:

    Contenido del div 1

    Esto ya no funciona, no muestra absolutamente nada, sin embargo si lo pones asi:

    Contenido del div 1

    si que funciona, pero claro no puedes poner ningun tipo de estilo ni nada, ya que solo sirve para texto.

    ¿alguna solucion?

    Gracias por anticipado.