Skip to content

Instantly share code, notes, and snippets.

@alexdzul
Last active June 17, 2018 22:23
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save alexdzul/fd29454198213d06d001 to your computer and use it in GitHub Desktop.
Save alexdzul/fd29454198213d06d001 to your computer and use it in GitHub Desktop.
Paginación inteligente con Django Template Engine
<!--
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 %}">&laquo;</a></li>
{% else %}
<li class="disabled"><a href="#">&laquo;</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 %}">&raquo;</a></li>
{% else %}
<li><a href="#" class="disabled">&raquo;</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