Last active
June 17, 2018 22:23
-
-
Save alexdzul/fd29454198213d06d001 to your computer and use it in GitHub Desktop.
Paginación inteligente con Django Template Engine
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
autor: Alex Dzul @alexjs88 | |
Supongamos que tenemos miles de objetos a paginar. Django por sí solo no cuenta con una función que nos | |
permita definir cuántas páginas queremos mostrar y en tu template te podría aparecer miles de páginas: | |
< 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 N1.. N2.. etc ... > | |
Si en nuestro sitio solo queremos mostrar un fragmento de páginas, entonces con este SNIP podemos definir | |
el intervalo de páginas hacia la izquierda y hacia la derecha que necesitamos. | |
Ejemplo, si quiero mostrar -5 y +5 páginas de la actual el resultado que podremos obtener es el siguiente: | |
-- Si estamos en la página 10: | |
< 5 6 7 8 9 10 11 12 13 14 15 > | |
^ | |
-- Imaginemos ahora que estamos en la página 32: | |
< 27 28 29 30 31 32 33 34 35 36 37 > | |
^ | |
--> | |
{# En este ejemplo vemos el caso de paginación de un sitio tipo Blog maquetado con Bootstrap.#} | |
{% block pagination %} | |
{% if is_paginated %} | |
<ul class="pagination"> | |
{% if page_obj.has_previous %} | |
<li class="enabled"><a href="{% url 'blog:index_paginated' page_obj.previous_page_number %}">«</a></li> | |
{% else %} | |
<li class="disabled"><a href="#">«</a></li> | |
{% endif %} | |
{% for num_page in paginator.page_range %} | |
{# Solo mostramos +5 y -5 en el paginator. Podemos cambiar si necesitamos mostrar más o menos páginas #} | |
{% if page_obj.number|add:'-5' <= num_page and page_obj.number|add:"5" >= num_page%} | |
{%if page_obj.number == num_page %} | |
<li class="active"><a href="#">{{ num_page }}<span class="sr-only">(current)</span></a></li> | |
{% else %} | |
<li><a href="{% url 'blog:index_paginated' num_page %}">{{ num_page }}<span class="sr-only">(current)</span></a></li> | |
{% endif %} | |
{% endif %} | |
{% endfor %} | |
{% if page_obj.has_next %} | |
<li><a href="{% url 'blog:index_paginated' page_obj.next_page_number %}">»</a></li> | |
{% else %} | |
<li><a href="#" class="disabled">»</a></li> | |
{% endif %} | |
</ul><!--//pagination--> | |
{% endif %} | |
{% endblock pagination %} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment